Como Exibir Barra Lateral Diferente para Cada Post e Página no WordPress

‘Como posso mostrar conteúdo de barra lateral diferente para minhas postagens de blog e páginas de vendas?’ Esta é uma pergunta comum que recebo de usuários que entendem que barras laterais únicas nem sempre são a melhor abordagem.

Diferentes tipos de conteúdo geralmente precisam de elementos de suporte diferentes para serem eficazes.

Aprendemos que personalizar barras laterais para conteúdo específico pode melhorar drasticamente o engajamento e as taxas de conversão. Embora possa parecer complexo, as ferramentas modernas do WordPress tornam surpreendentemente simples adicionar barras laterais diferentes em todo o seu site.

Hoje, vamos guiá-lo pelos métodos mais confiáveis para criar e gerenciar várias barras laterais no WordPress.

Por que exibir uma barra lateral diferente para certas páginas ou postagens no WordPress?

Às vezes, você pode querer exibir uma barra lateral do WordPress diferente para certas postagens ou páginas para fornecer conteúdo mais relevante aos seus visitantes.

Essa personalização pode ser especialmente útil quando você tem tópicos diversos em seu site ou deseja destacar informações específicas para diferentes seções.

Por exemplo, você pode querer exibir widgets específicos de categoria em suas postagens de blog, exibir informações relacionadas a produtos em suas páginas de loja online ou mostrar feeds de mídia social em sua página Sobre.

Barras laterais personalizadas também podem ajudar você a criar uma experiência mais focada para seus leitores, apresentando links relevantes, anúncios ou botões de call-to-action adaptados ao conteúdo que eles estão visualizando.

Dito isso, vamos analisar 3 métodos para adicionar barras laterais diferentes para posts e páginas no WordPress. Você pode usar os links rápidos abaixo para pular para o método que melhor lhe convier:

• Método 1: Crie um Tema Personalizado com Barras Laterais Diferentes para Páginas ou Posts Específicos (Recomendado)
• Método 2: Exiba uma Barra Lateral Diferente em Certas Páginas com um Plugin Gratuito (Temas Clássicos)
• Método 3: Adicione Barras Laterais Diferentes a Templates Específicos no Editor de Site Completo do WordPress (Temas de Bloco)

Método 1: Crie um Tema Personalizado com Barras Laterais Diferentes para Páginas ou Posts Específicos (Recomendado)

De todos os métodos que experimentamos para este tutorial, recomendamos criar um tema personalizado. A razão é que ele oferece a maior flexibilidade e controle sobre o design do seu site WordPress.

Dito isso, sugerimos seguir este método apenas se você estiver nas fases iniciais da construção do seu site ou se estiver interessado em trocar seu tema WordPress corretamente. Isso porque a troca de temas pode impactar significativamente seu conteúdo e layout existentes.

Se você não quiser trocar de tema, pode pular para o método 2 (temas clássicos) ou método 3 (temas de blocos).

Para este tutorial, recomendamos o uso de um construtor de páginas como SeedProd ou Thrive Architect.

Construtores de páginas oferecem muito mais opções de personalização e controle sobre seu tema, por isso achamos melhor usá-los em vez dos recursos integrados do WordPress.

Várias de nossas marcas parceiras usam o SeedProd porque ele é amigável para iniciantes e confiável. Você pode aprender mais sobre a ferramenta em nossa análise do SeedProd.

Antes de mais nada, instale o plugin SeedProd em seu site. Se for a sua primeira vez, consulte nosso guia para iniciantes sobre como instalar um plugin WordPress.

Assim que terminar, insira sua chave de licença do SeedProd no campo apropriado e clique em ‘Verificar chave’.

Em seguida, vá para SeedProd » Construtor de Temas.

Em seguida, clique no botão ‘Kits de Modelos de Tema’.

Agora você deve ver todos os kits de modelos de tema disponíveis. Sinta-se à vontade para usar qualquer um deles como base para seu tema personalizado.

Você também pode passar o mouse sobre cada kit e clicar no botão de lupa para visualizar o tema mais de perto.

Para este tutorial, recomendamos escolher um kit de tema que já tenha uma página com uma barra lateral, para que você possa simplesmente duplicar este modelo de página e personalizar a barra lateral mais tarde.

Por exemplo, o kit de tema Curbside Food Truck tem um modelo de postagem única que já inclui uma barra lateral:

Depois de decidir sobre um kit, basta passar o cursor sobre ele.

Em seguida, clique no ícone de marca de verificação laranja quando ele aparecer.

Agora, aguarde alguns momentos para o SeedProd configurar seu tema.

Após isso, você deverá ser redirecionado para a página de configurações do 'Theme Builder' novamente e verá que o SeedProd criou vários modelos de tema para o seu site WordPress.

Agora podemos começar a editar seu modelo de tema.

Digamos que você queira que a barra lateral em suas páginas de arquivo de categoria de blog seja diferente daquela em suas postagens de blog. Nesse caso, você precisará criar 2 modelos de tema de barra lateral diferentes.

Primeiro, encontre o modelo de tema 'Sidebar' em seu kit. Esta é a barra lateral padrão que seu tema usa quando uma página requer uma barra lateral.

Para ilustração, duplicaremos este modelo e o editaremos para torná-lo diferente da versão original. Para fazer isso, você pode passar o mouse sobre o modelo e clicar em 'Duplicar'.

Agora você deve ver uma versão copiada do seu modelo de barra lateral.

Aqui, clique em 'Editar Design'.

Você chegará ao editor do SeedProd. Se o modelo de barra lateral parecer mais largo do que o esperado, não se preocupe. O tamanho será ajustado quando a barra lateral for adicionada a uma página posteriormente.

No tema escolhido, o modelo de barra lateral padrão exibe uma barra de pesquisa, um call-to-action para inscrição em newsletter, links para nossas páginas de categoria de blog e uma prévia do nosso feed do Instagram.

Vamos substituir alguns desses elementos. Esses blocos foram organizados em grupos ou linhas, para que possamos excluir vários blocos em uma única linha de uma vez, em vez de removê-los um por um.

Para fazer isso, você pode passar o mouse sobre um elemento até que uma linha azul escura apareça sobre um grupo inteiro de blocos. Em seguida, clique no ícone de lixeira 'Excluir Linha' na parte superior do elemento.

Para criar uma nova linha, passe o mouse sobre o elemento imediatamente acima de onde você deseja que a nova linha apareça. Quando uma linha azul escura aparecer, clique no ícone de ‘+’ que surge abaixo dela.

Em seguida, você precisa clicar no ícone de ‘+’ abaixo.

Agora, você pode escolher um layout para a linha.

Vamos escolher a primeira opção porque é a mais adequada para nossas necessidades.

É aqui que você pode começar a se divertir e adicionar todos os tipos de blocos à sua barra lateral.

O SeedProd tem muitas opções para escolher, desde um cronômetro e um hotspot de imagem até uma barra de progresso e muito mais. Você pode usar a barra de pesquisa ou rolar para baixo na aba ‘Blocos’ para encontrar o bloco que precisa.

Assim que encontrar um bloco que goste, basta arrastá-lo e soltá-lo na linha.

Para fins de exemplo, decidimos adicionar o bloco 'Depoimentos'.

Você pode usar isso para exibir uma avaliação positiva de um cliente como prova social. Se quiser aprender como adicionar um também, pode ler nosso guia sobre como adicionar depoimentos rotativos no WordPress.

Sinta-se à vontade para adicionar mais linhas e blocos neste ponto.

Depois de ficar satisfeito com o design da barra lateral, basta clicar no ícone de seta ao lado do botão 'Salvar' no canto superior direito da página. Em seguida, clique em 'Publicar'.

Agora, vamos adicionar esta nova barra lateral a um modelo de postagem ou página. Para fazer isso, volte para SeedProd » Theme Builder no seu painel do WordPress.

O kit de tema que estamos usando tem 2 modelos de tema que apresentam uma barra lateral: 'Postagem Única' e 'Arquivos, Resultados de Pesquisa'. O primeiro é para postagens do WordPress, enquanto o segundo é para todas as páginas de arquivo, incluindo arquivos de categoria, bem como a página de resultados de pesquisa.

Ambos os modelos atualmente usam o mesmo modelo de barra lateral.

Neste caso, queremos que o modelo 'Arquivos, Resultados de Pesquisa' use a nova barra lateral que acabamos de criar. Portanto, localize o modelo que deseja editar e clique em 'Editar Design'.

No editor SeedProd, passe o mouse sobre a área com a barra lateral e, quando uma barra de ferramentas laranja aparecer em cima dela, clique nela.

O painel de configurações à esquerda deve dizer 'Editando: Partes do Modelo'.

No menu suspenso Parte do Modelo, você precisa selecionar o modelo de barra lateral que acabou de criar.

Agora você deve ver que sua nova barra lateral foi adicionada ao seu modelo de página.

Depois disso, basta clicar em 'Salvar' para publicar suas alterações.

Nesta fase, você pode criar mais barras laterais e adicioná-las a outras páginas repetindo os mesmos passos anteriores.

Quando estiver satisfeito, volte para SeedProd » Theme Builder novamente e ative a configuração ‘Enable SeedProd Theme’ até que diga ‘YES.’ Isso ativará seu tema SeedProd em seu site.

E é isso!

Veja como fica nossa barra lateral personalizada:

Método 2: Exiba uma Barra Lateral Diferente em Certas Páginas com um Plugin Gratuito (Temas Clássicos)

A coisa complicada com temas clássicos é que a maneira como cada um lida com as barras laterais é diferente. E na maioria das vezes, você precisa usar a mesma barra lateral em todo o seu site.

Se você quiser criar várias barras laterais para o seu tema, sugerimos usar o Lightweight Sidebar Manager. Este plugin de barra lateral personalizado permite que você crie quantas barras laterais quiser e depois as atribua a diferentes posts e páginas.

Você também pode adicioná-las a tipos de postagem personalizados ou atribuir uma barra lateral a todas as diferentes páginas ou posts que tenham uma categoria específica.

A primeira coisa que você precisa fazer é instalar e ativar o plugin Lightweight Sidebar Manager. Para mais detalhes, veja nosso guia passo a passo sobre como instalar um plugin do WordPress.

Após a ativação, você precisa ir para Aparência » Barras Laterais. Para criar a primeira barra lateral, clique no botão ‘Adicionar Nova’.

Agora você pode digitar um título para a nova barra lateral do WordPress. Isso é apenas para sua referência, então você pode usar o que quiser.

Com isso feito, abra o menu suspenso ‘Sidebar To Replace’ e escolha o local onde você deseja exibir a barra lateral. As opções que você vê podem variar dependendo do seu tema WordPress. 

Agora, você pode controlar onde a barra lateral aparece criando regras de inclusão ou exclusão. 

Para criar uma regra de inclusão, basta abrir o menu suspenso ‘Display On’ e escolher as páginas, posts, tipos de post personalizados ou categorias onde você deseja usar a barra lateral. 

Por exemplo, você pode adicionar a barra lateral a uma página específica, como sua página de erro 404, o arquivo do autor ou a página do blog.

Outra opção é usar a barra lateral para uma página, post ou categoria específica selecionando ‘Specific Pages/Posts/Taxonomies’.

Isso adiciona uma caixa onde você pode digitar a página, post ou categoria.

Para criar mais regras de inclusão, basta clicar no botão ‘Add Display’ Rule.

Isso adiciona uma seção onde você pode criar a nova regra de inclusão.

Se preferir, você pode criar regras de exclusão em vez disso. Por exemplo, você pode querer mostrar a barra lateral em todas as páginas, exceto na página inicial. 

Você também pode combinar regras de inclusão e exclusão para controlar exatamente onde a barra lateral aparece em seu blog WordPress.

Para criar uma regra de exclusão para a localização da barra lateral, basta clicar no botão ‘Adicionar Regra de Exclusão’.

Na nova seção ‘Não Exibir Em’, abra o menu suspenso e selecione a página ou post que não deve usar esta barra lateral. 

Você também pode excluir a barra lateral de páginas do WordPress que tenham uma categoria específica, seguindo o mesmo processo descrito acima.

Depois de decidir onde a barra lateral aparecerá, você pode querer mostrar conteúdo diferente para usuários diferentes.

Por exemplo, se você tem um site de membros, você pode querer usar uma barra lateral diferente para visitantes do que para membros logados. 

Para fazer isso, abra o menu suspenso ‘Usuário’ e escolha uma função no menu suspenso. Agora, apenas pessoas com esta função de usuário específica verão a barra lateral. 

Finalmente, você pode querer digitar uma descrição opcional. Isso aparecerá apenas no painel do WordPress, então é uma boa maneira de compartilhar informações com outros administradores ou usuários.

Se você for criar muitas barras laterais, também pode usar este campo para deixar notas e lembretes úteis para si mesmo.

Quando estiver satisfeito com as informações que inseriu, basta clicar em ‘Publicar’.

Com isso feito, vá para Aparência » Widgets. Agora você verá todas as áreas de widget que seu tema suporta por padrão, mais a nova barra lateral que você criou na etapa anterior.

Agora você pode adicionar widgets à barra lateral, assim como qualquer outra seção de widgets.

Para instruções passo a passo, consulte nosso guia sobre como adicionar e usar widgets do WordPress. 

Quando estiver satisfeito com a configuração da barra lateral, clique em ‘Atualizar’.

Agora, se você visitar seu blog WordPress, verá a nova barra lateral ativa.

Para criar mais barras laterais de tema, basta continuar repetindo essas etapas. 

Método 3: Adicione Barras Laterais Diferentes a Templates Específicos no Editor de Site Completo do WordPress (Temas de Bloco)

Se você usa um tema de blocos, como o Twenty Twenty-Four ou o tema Hestia, você pode usar o editor de site completo para criar barras laterais personalizadas e colocá-las onde quiser. Usaremos o tema Twenty Twenty-Four para demonstrar este método.

O legal dos temas de blocos é que a forma como eles são editados é a mesma. Portanto, você não precisa de um plugin especial de barra lateral do WordPress. Você pode simplesmente usar o editor de site completo para adicionar uma barra lateral diferente a páginas ou posts específicos.

Primeiro, vá para Aparência » Editor no seu painel do WordPress.

Aqui, você verá alguns menus para personalizar seu tema de blocos.

Para criar uma nova barra lateral, você precisa selecionar ‘Padrões’.

Agora, clique em ‘Todas as partes do modelo’.

Você deverá ver agora uma parte do modelo chamada ‘Sidebar’. Clique no menu de três pontos e, em seguida, selecione ‘Duplicar’. Isso criará uma cópia do modelo de barra lateral que você poderá personalizar.

Na nova janela pop-up, dê um nome à sua nova barra lateral para identificá-la facilmente mais tarde.

Na seção ‘Área’, selecione ‘Geral’. Feito isso, basta clicar em ‘Duplicar’.

Agora você deve ver sua barra lateral recém-duplicada na lista de partes do modelo.

Simplesmente clique na miniatura para abrir a interface de edição.

Agora, você pode começar a personalizar sua barra lateral, adicionar mais blocos ou configurá-los para corresponder ao design do seu site. O editor de site completo funciona da mesma forma que o editor de blocos Gutenberg, no sentido de que você só precisa arrastar e soltar blocos na parte do modelo.

No nosso caso, decidimos exibir nossas posts mais recentes, um botão de call-to-action para assinar nossa lista de e-mail e um divisor de forma para separar esses elementos.

Assim que estiver satisfeito com a aparência da barra lateral, clique no botão ‘Salvar’.

Agora, precisamos adicionar essa nova barra lateral a um modelo de página.

Primeiro, volte ao menu principal do editor de site completo. Em seguida, clique em ‘Modelos’.

O modelo Twenty Twenty-Four tem vários modelos de página com uma barra lateral, mas todos eles usam a mesma parte do modelo de barra lateral. Vamos alterar um deles com nossa barra lateral recém-criada.

Para fazer isso, selecione um modelo de página com uma barra lateral. No nosso caso, selecionaremos ‘Página com Barra Lateral’ para que a barra lateral nas páginas normais tenha uma aparência diferente daquela nas postagens individuais do WordPress.

Na interface de edição, clique na seção ‘Barra Lateral’.

Na barra de ferramentas de blocos, clique no menu de três pontos e selecione ‘Excluir’ para remover a barra lateral antiga.

Em seguida, clique no ícone de ‘+’ nessa mesma seção.

Depois disso, localize e selecione ‘Parte do Modelo’.

Assim que tiver feito isso, prossiga e clique em ‘Escolher’.

Isso permitirá que você escolha a barra lateral que acabou de criar.

Um novo pop-up aparecerá, mostrando as diferentes partes do modelo que o tema possui.

Aqui, basta clicar na nova parte do modelo da barra lateral.

Nesta fase, você pode continuar personalizando o modelo, se necessário.

Em seguida, basta clicar em ‘Salvar’.

Agora você personalizou um modelo de página e adicionou uma barra lateral personalizada a ele.

No entanto, precisamos garantir que este modelo seja realmente usado em seu site. Para fazer isso, volte ao menu principal do editor de site completo e clique em ‘Páginas’.

Em seguida, escolha uma página à qual deseja adicionar a barra lateral.

Para fins de exemplo, usaremos nossa página ‘Política de Privacidade’.

Agora, clique no ícone de configurações no canto superior esquerdo da página e clique em ‘Páginas’ no painel de configurações da página.

Depois disso, você precisa selecionar ‘Trocar modelo’.

Assim que fizer isso, um pop-up aparecerá.

Aqui, basta selecionar o modelo de página com a nova barra lateral.

E é isso! Sinta-se à vontade para repetir os mesmos passos para criar uma nova barra lateral personalizada e implementá-la em diferentes páginas e posts.

Veja como nossa página de exemplo de política de privacidade fica com a nova barra lateral:

Esperamos que este artigo tenha ajudado você a aprender como mostrar diferentes barras laterais em páginas e posts no WordPress. Você também pode querer conferir nosso guia sobre como mudar o lado da barra lateral no WordPress e nossas escolhas de especialistas das melhores alternativas ao Canva para gráficos de sites.

Se você gostou deste artigo, por favor, inscreva-se em nosso Canal do YouTube para tutoriais em vídeo do WordPress. Você também pode nos encontrar no Twitter e no Facebook.