Deseja saber como adicionar uma barra lateral no WordPress?
As barras laterais são espaços valiosos que podem ajudar os leitores a navegar pelo seu site WordPress, assinar seu boletim informativo, seguir seus perfis de mídia social e muito mais. Mas como criar uma barra lateral adaptada às suas necessidades de conteúdo?
Este artigo mostrará a você como adicionar uma barra lateral no WordPress usando três métodos diferentes.
O que é uma barra lateral do WordPress?
Uma barra lateral do WordPress é uma coluna de espaço vertical que fica à esquerda ou à direita de sua área de conteúdo principal. É uma área com widgets que permite exibir conteúdo fora da área de conteúdo principal.
Embora a área de conteúdo principal mude em cada página, a barra lateral permanecerá praticamente a mesma em todo o site (a menos que você crie várias barras laterais).
Seu tema do WordPress controla a aparência da barra lateral por padrão. Portanto, se você usá-la imediatamente, seu tema controlará o posicionamento da barra lateral, quantas barras laterais você pode usar ao mesmo tempo e se você realmente tem uma barra lateral.
Sua barra lateral padrão também pode vir com widgets que não atendem às suas necessidades comerciais. Se a barra lateral padrão não atender às suas necessidades, talvez seja necessário criar uma nova barra lateral personalizada.
Para que você pode usar a barra lateral do WordPress?
Você pode adicionar praticamente qualquer conteúdo à sua barra lateral usando widgets do WordPress. Aqui estão alguns exemplos:
- Navegação - Você pode usar widgets de menu de navegação para ajudar os usuários a encontrar páginas relevantes ou um menu para filtrar as publicações do seu blog por categoria.
- Pesquisa - Adicionar uma caixa de pesquisa à sua barra lateral é uma excelente maneira de ajudar os usuários a encontrar rapidamente o que estão procurando.
- Assinatura de e-mail - Adicione um formulário de e-mail opt-in à barra lateral para coletar endereços de e-mail e aumentar sua lista.
- Conteúdo em destaque - Sua barra lateral é um ótimo lugar para exibir posts únicos que são mais valiosos para os usuários do que outros.
- Mídia social - Você pode adicionar facilmente botões de acompanhamento social e um widget de compartilhamento de mídia social para aumentar seus seguidores e aumentar o conhecimento da marca.
- Anúncios - Sua barra lateral é um excelente local para exibir anúncios se você os usar para gerar receita.
- Chamadas para ação (CTA) - Se você tiver um novo curso, produto ou oferta on-line, poderá adicionar uma CTA à sua barra lateral para incentivar os leitores a dar uma olhada.
A esta altura, você já sabe o que é uma barra lateral e como ela é uma maneira fácil de exibir conteúdo valioso para os visitantes do seu site. Agora vamos dar uma olhada em como adicionar uma barra lateral no WordPress.
Compartilhamos três métodos diferentes abaixo, usando o personalizador do WordPress, a tela de widgets do WordPress e um plug-in de construtor de sites. Melhor ainda, nenhum desses métodos exige o uso de código.
Como adicionar uma barra lateral personalizada no WordPress com o SeedProd
Deseja criar uma barra lateral personalizada ou usar várias barras laterais simultaneamente em seu site WordPress?
Para isso, você precisará de um plug-in do WordPress ou do conhecimento para criar uma nova barra lateral do zero com código. Felizmente, você pode criar facilmente barras laterais personalizadas para o WordPress com um plugin poderoso e leve: SeedProd.
O SeedProd é o melhor construtor de sites WordPress do tipo arrastar e soltar. Você pode usá-lo para criar temas personalizados do WordPress e layouts de página sem código.
O SeedProd usa modelos individuais para criar todas as partes do seu tema. Um desses modelos é o Sidebar, que permite adicionar uma barra lateral personalizada ao seu site com apenas alguns cliques.
Melhor ainda, você pode criar quantas barras laterais quiser com o SeedProd e exibi-las em páginas e posts específicos do seu site.
Portanto, siga as etapas abaixo para adicionar uma barra lateral ao WordPress com o SeedProd.
Etapa 1. Instalar o construtor de sites SeedProd
A primeira etapa é instalar o plug-in do SeedProd Website Builder.
Observação: você precisará de uma licença do SeedProd Pro ou Elite para usar o recurso Theme Builder.
Você pode seguir este guia sobre como instalar um plug-in do WordPress se precisar de ajuda com essa etapa.
Depois de instalar e ativar o arquivo .zip do plug-in, vá para a página SeedProd ≫ Settings e insira os detalhes da chave de licença. Você pode encontrar sua chave de licença no site do SeedProd, no painel de controle da sua conta.
Etapa 2. Crie seus modelos de tema do WordPress
Para criar uma barra lateral personalizada com o SeedProd, primeiro você precisará criar as diferentes partes do seu tema. Não se preocupe; isso é muito fácil de fazer e não requer a edição direta de nenhum arquivo de modelo.
Primeiro, vá para a página SeedProd " Theme Builder. Nessa página, você verá uma lista de modelos para seu tema atual do SeedProd.
Como ainda não começamos, temos apenas um modelo CSS Global.
Para começar, você tem duas opções.
- Use um dos temas prontos do SeedProd como ponto de partida
- Criar manualmente modelos de temas a partir do zero
Sugerimos que você comece com um modelo de tema predefinido. Isso permite que o SeedProd gere automaticamente todos os arquivos de modelo, dando-lhe uma vantagem inicial na edição dos modelos de acordo com suas necessidades.
Para escolher um modelo de tema, clique no botão Temas e selecione um dos temas disponíveis. Há diferentes temas para diferentes sites, portanto, escolha aquele que melhor atenda às suas necessidades.
Depois de escolher um tema, o SeedProd criará automaticamente todos os modelos de tema para você. Como resultado, agora você pode editar cada modelo individualmente no editor visual de arrastar e soltar.
Etapa 3. Personalize sua barra lateral do WordPress
Para personalizar sua barra lateral com o SeedProd, localize o modelo Sidebar e clique no link Edit Design.
Isso abrirá sua barra lateral no construtor de arrastar e soltar do SeedProd. Você verá uma visualização ao vivo do seu modelo de barra lateral na coluna da direita com um painel de edição na coluna da esquerda.
Alterar um item na barra lateral é tão simples quanto apontar e clicar. Por exemplo, você pode clicar no ícone da lixeira para excluir blocos.
Ou você pode clicar em qualquer bloco para ver suas configurações no painel esquerdo.
Você pode adicionar uma grande variedade de conteúdo à sua barra lateral usando os blocos temáticos do SeedProd. Basta arrastar um bloco da esquerda e soltá-lo em seu lugar na barra lateral.
Alguns dos blocos que você pode escolher incluem:
- Tags de modelo - Blocos que permitem adicionar conteúdo dinâmico do WordPress, como postagens de blog, comentários, imagens em destaque, etc. Essa é uma ótima maneira de criar uma barra lateral dinâmica.
- Blocos padrão - Esses são elementos populares de web design que a maioria dos sites usa, como imagens, botões, texto e vídeos.
- Blocos avançados - Recursos avançados de geração de leads, como formulários de contato, perfis sociais, botões de compartilhamento, formulários de opt-in, Google Maps e muito mais.
- WooCommerce - Se você tiver uma loja on-line, poderá usar os blocos do WooCommerce para exibir produtos populares, carrinhos de compras e outros recursos da loja na barra lateral.
Além de adicionar conteúdo à barra lateral, o SeedProd também permite que você personalize suas cores, fontes, espaçamento, bordas e muito mais.
Por exemplo, se você clicar no ícone de configurações de uma seção, poderá ver opções para alterar a cor do plano de fundo, carregar uma imagem de plano de fundo e alterar a largura. Em seguida, há mais configurações na guia Advanced que permitem controlar as bordas, o espaçamento e muito mais.
Quando estiver satisfeito com sua nova barra lateral, clique no botão verde Save (Salvar ) no canto superior direito da tela.
Agora repita esse processo para os outros modelos em seu tema, incluindo:
- Página única
- Postagem única
- Índice/Arquivos do blog
- Página inicial
- Cabeçalho
- Rodapé
Como resultado, você pode criar um tema WordPress personalizado que atenda a todas as suas necessidades comerciais.
Etapa 4. Publique sua barra lateral personalizada no WordPress
Quando estiver satisfeito com sua barra lateral personalizada do WordPress, a etapa final é ativá-la em seu site do WordPress.
No SeedProd, você pode aplicar sua barra lateral personalizada do WordPress com uma simples mudança.
Basta acessar a página SeedProd " Theme Builder e alternar o botão ao lado da opção "Enable SeedProd Theme" (Ativar tema do SeedProd) para "Yes" (Sim).
O SeedProd agora substituirá seu design existente pelo novo tema e barra lateral do WordPress.
Agora você pode visitar seu site para ver sua barra lateral personalizada do WordPress em ação.
Como adicionar várias barras laterais no WordPress com o SeedProd
Agora que você tem uma barra lateral personalizada, pode editar o design sempre que quiser. Mas e se você quiser mais de uma barra lateral e quiser exibi-la em diferentes seções do seu site?
Por exemplo, talvez você queira criar uma barra lateral para páginas diferentes da barra lateral do seu blog. Você pode fazer isso usando as partes do modelo global do SeedProd.
Aqui está a parte 13 do nosso tutorial do construtor de temas, que mostra como as partes globais funcionam:
Como alternativa, você pode seguir as instruções escritas abaixo.
Primeiro, vá para a página SeedProd " Theme Builder e clique no botão Add New Theme Template (Adicionar novo modelo de tema ).
A partir daí, escolha a opção Global Part e clique em Save.
Agora você pode criar sua barra lateral personalizada como fez na etapa anterior.
Depois de criar sua nova barra lateral, abra o modelo Single Page no editor de arrastar e soltar do SeedProd.
Para abrir espaço para a barra lateral, será necessário substituir o layout existente por uma seção de duas colunas.
Em seguida, arraste o bloco Template Part para a segunda coluna da sua nova seção.
A partir daí, você pode escolher a nova barra lateral que criou no menu suspenso.
Clique em Save (Salvar ) para armazenar as alterações e, quando você navegar para uma página, ela exibirá automaticamente a nova barra lateral personalizada, enquanto as postagens do blog exibirão a primeira barra lateral.
Como adicionar uma barra lateral no WordPress com o Customizer
O personalizador integrado do WordPress facilita a adição de uma barra lateral personalizada ao seu site WordPress. O personalizador usa as configurações padrão do tema do WordPress para controlar o layout, o conteúdo e o posicionamento da barra lateral.
Para usar esse método, você precisará de um tema do WordPress que inclua áreas de widgets da barra lateral. Se você ainda não tem um tema, aqui estão os temas mais populares do WordPress para pequenas empresas.
Para este guia, estamos usando o Astra WordPress Theme.
Etapa 1: Adicionar o layout da barra lateral do WordPress
Depois de instalar seu tema, vá para Appearance ≫ Themes (Aparência ≫ Temas ) e clique no botão azul Customize (Personalizar ).
Isso o levará à página do WordPress Customizer, onde você pode editar o layout e o design do tema. As configurações que você vê nessa página variam de acordo com os diferentes temas, mas mostraremos como adicionar uma barra lateral usando o tema Astra, para que você tenha uma ideia do que fazer.
Observe o painel esquerdo dentro do personalizador e encontre o título "Sidebar" (Barra lateral). Clique nesse título para abrir as opções de personalização de sua barra lateral.
Na tela seguinte, você pode escolher entre as seguintes opções de barra lateral:
- Layout padrão - Sem barra lateral, barra lateral direita ou barra lateral esquerda.
- Páginas - Onde exibir a barra lateral em páginas individuais.
- Posts - Onde mostrar sua barra lateral em posts individuais.
- Arquivos - A aparência da barra lateral em páginas de arquivo, como a página do blog.
Você também pode escolher a largura da barra lateral na mesma página. Quando estiver satisfeito com o layout de sua barra lateral, clique no botão Publicar.
Etapa 2. Adicionar widgets à barra lateral com o personalizador
Depois de escolher o layout da barra lateral, você pode começar a adicionar widgets a ela. Para fazer isso, localize o título "Widgets" no menu do Personalizador do WordPress e clique para abrir as configurações.
Na próxima tela, há uma lista de barras laterais disponíveis no momento para essa página específica, portanto, clique na barra lateral que deseja personalizar.
Agora você verá um construtor de barra lateral, pronto para exibir os widgets que você escolher. Clique no ícone de mais (+) para procurar um bloco ou widget que deseja exibir na barra lateral.
Ao clicar em um bloco, ele será adicionado automaticamente à sua barra lateral.
Continue adicionando widgets à barra lateral até que ela fique do jeito que você quer. Em seguida, clique no botão Publicar para salvar suas alterações.
Agora, quando você visitar sua página, verá sua barra lateral personalizada do WordPress.
Como adicionar uma barra lateral no WordPress usando a tela de widgets
O método a seguir usa a tela de widgets do WordPress para adicionar uma barra lateral ao WordPress. É semelhante ao método anterior, mas só permite que você adicione widgets à barra lateral em vez de alterar o posicionamento da barra lateral.
Vá para Appearance ≫ Widgets no painel do WordPress para usar esse método. Nessa tela, é possível ver todas as barras laterais compatíveis com seu tema no momento.
Em nosso caso, o tema inclui 4 áreas personalizáveis da barra lateral:
- Barra lateral principal
- Cabeçalho
- Barra de rodapé Seção 1
- Seção 2 do rodapé da página
A adição de widgets à sua barra lateral é semelhante à etapa anterior. Basta clicar no ícone de adição e procurar os widgets que deseja adicionar à barra lateral.
Quando terminar de criar sua barra lateral, clique no botão Update (Atualizar ). Agora você pode visitar seu site e ver sua nova barra lateral.
Por enquanto é isso!
Esperamos que este artigo tenha ajudado você a aprender como adicionar uma barra lateral no WordPress facilmente.
A maneira mais fácil de obter controle total sobre sua barra lateral é com o SeedProd. Ele oferece um construtor visual de arrastar e soltar, você não precisa editar nenhum código ou arquivo de tema diretamente e pode personalizar sua barra lateral diretamente no painel do WordPress.
Talvez você também goste desta publicação sobre os melhores exemplos de ímãs de leads para aumentar sua lista.
Obrigado pela leitura! Gostaríamos muito de ouvir sua opinião, portanto, fique à vontade para deixar um comentário com perguntas e feedback.
Você também pode nos seguir no YouTube, no X (antigo Twitter) e no Facebook para obter mais conteúdo útil para expandir seus negócios.
