A barra lateral é uma área pronta para widgets no seu tema WordPress onde você pode exibir informações que não fazem parte do conteúdo principal da página. No entanto, as barras laterais podem ser distrativas e ocupar espaço valioso.
Na WPBeginner, ajudamos milhares de usuários a projetar seus sites WordPress. Em nossa experiência, existem várias maneiras de remover uma barra lateral. Você pode ocultá-la nas configurações do tema, removê-la de páginas e posts individuais e usar o editor de site completo.
Neste artigo, mostraremos como remover facilmente a barra lateral no WordPress.
Por que Remover a Barra Lateral no WordPress?
A maioria dos temas WordPress vem com várias barras laterais ou áreas prontas para widgets.
Você pode usar barras laterais para exibir uma lista de seus posts recentes, anúncios, formulários de inscrição para sua lista de e-mails, ou qualquer outro conteúdo que não faça parte da página ou post principal.
Na WPBeginner, usamos uma barra lateral para promover nossas páginas de mídia social e exibir nossos posts mais populares.
Você pode facilmente adicionar itens à barra lateral de um tema usando widgets do WordPress.
Na maioria dos temas WordPress, a barra lateral tem uma aparência diferente dependendo se o visitante está usando um desktop ou um dispositivo móvel. Como smartphones e tablets têm telas menores, o WordPress geralmente move as barras laterais para o final da tela.
Dependendo de como seu site está configurado, isso pode parecer estranho. Usuários de dispositivos móveis também precisarão rolar até o final da tela para ver o conteúdo da barra lateral, o que pode afetar a experiência do usuário. Para mais informações, consulte nosso guia sobre como visualizar a versão móvel de sites WordPress do desktop.
Mesmo em um desktop, a barra lateral pode distrair do conteúdo mais importante, como a chamada para ação da página.
Dito isso, vamos ver como você pode remover a barra lateral no WordPress. Mostraremos como excluir a barra lateral de todo o seu site e como ocultar a barra lateral apenas em uma página ou post específico.
- Método 1. Removendo Barras Laterais Usando as Configurações do Seu Tema WordPress
- Método 2. Removendo a Barra Lateral Usando a Edição Completa do Site (Apenas Temas Baseados em Blocos)
- Método 3. Remova a Barra Lateral de Todo o Seu Site WordPress (Avançado)
- Método 4. Removendo Barras Laterais de Páginas Individuais no WordPress
- Método 5. Removendo Barras Laterais de uma Página Estática no WordPress
- Método 6. Remova a Barra Lateral de um Post Único no WordPress
- Tutorial em Vídeo
Se você preferir pular direto para um método específico, pode usar os links acima.
Método 1. Removendo Barras Laterais Usando as Configurações do Seu Tema WordPress
Muitos dos melhores temas WordPress vêm com configurações integradas para remover barras laterais. Dependendo do seu tema, você pode ser capaz de remover a barra lateral de posts e páginas individuais ou até mesmo de todo o seu site.
Para verificar se o seu tema tem essa opção, vá para Aparência » Personalizar.
No menu do lado esquerdo, procure por uma configuração de 'Barra Lateral' ou similar.
Na imagem a seguir, você pode ver as opções para o popular tema Astra para WordPress.
Se você vir uma opção de 'Barra lateral' ou similar, selecione-a e procure por quaisquer configurações que removam a barra lateral.
Isso pode ser um menu suspenso, miniaturas mostrando os diferentes layouts de barra lateral ou alguma outra configuração.
Se o seu tema não tiver uma opção de 'Barra lateral', você poderá remover a barra lateral selecionando a seção 'Página' ou similar.
Como você pode ver na imagem a seguir, o Astra também tem uma configuração de 'Página'.
Aqui, você verá diferentes layouts, incluindo vários que removem a barra lateral, como 'Sem barra lateral' e 'Largura total / Esticada'.
Basta clicar em uma miniatura para aplicar esse layout ao seu site.
Não importa como você remova a barra lateral, não se esqueça de clicar em ‘Publicar’.
Alguns temas também permitem que você remova a barra lateral de posts e páginas individuais. Isso pode ser útil ao projetar páginas personalizadas, como uma landing page ou página de vendas.
Para ver se o seu tema possui essas configurações, basta abrir qualquer página ou post onde você deseja ocultar a barra lateral. No menu à direita, selecione ‘Post’ ou ‘Página’ e, em seguida, procure por uma opção ‘Configurações do Post’ ou ‘Configurações da Página’.
Se o seu tema tiver esta seção, clique para expandir. Agora você pode procurar por quaisquer configurações que permitam remover a barra lateral.
Na imagem a seguir, você pode ver as configurações de post para o popular tema ThemeIsle Hestia.
Com alguns temas do WordPress, não é possível remover a barra lateral usando o personalizador ou o editor de páginas. Se for esse o caso, continue lendo e mostraremos outras maneiras de remover a barra lateral no WordPress.
Método 2. Removendo a Barra Lateral Usando a Edição Completa do Site (Apenas Temas Baseados em Blocos)
Se você estiver usando um tema de bloco como o Divi, você pode remover a barra lateral usando a Edição Completa do Site (FSE) e o editor de blocos.
Esta é uma maneira rápida e fácil de remover a barra lateral de todo o seu site, embora não funcione com todos os temas.
Para iniciar o editor, vá para Aparência » Editor.
Por padrão, o editor de site completo exibe o modelo inicial do seu tema, mas você pode remover a barra lateral de qualquer página.
Para ver todas as opções disponíveis, basta selecionar 'Modelos', 'Padrões' ou 'Páginas'.
Agora você pode clicar no modelo ou página onde deseja remover a barra lateral.
O WordPress agora mostrará uma prévia do design. Para prosseguir e editar este modelo, clique no pequeno ícone de lápis.
Agora você pode clicar para selecionar a barra lateral.
Na pequena barra de ferramentas que aparece, clique no ícone pontilhado.
Agora você pode excluir a barra lateral clicando em 'Remover Coluna' ou em uma configuração semelhante.
Depois de fazer isso, você pode prosseguir e clicar no botão 'Salvar'.
Agora, se você visitar seu site WordPress, verá que a barra de ferramentas desapareceu.
Você também pode querer ver nosso guia sobre edição de site completo no WordPress.
Método 3. Remova a Barra Lateral de Todo o Seu Site WordPress (Avançado)
Este método permite remover barras laterais de todas as páginas e posts do seu blog ou site WordPress.
Você precisará editar os arquivos do seu tema, portanto, não é a opção mais amigável para iniciantes. No entanto, este método deve funcionar para a maioria dos temas do WordPress, incluindo temas que não possuem uma maneira integrada de ocultar a barra lateral.
Lembre-se de que, se você editar diretamente os arquivos do seu tema WordPress, essas alterações desaparecerão quando você atualizar o tema.
Dito isso, recomendamos criar um tema filho, pois isso permite que você atualize seu tema WordPress sem perder personalizações.
Primeiro, você precisa se conectar ao seu site WordPress usando um cliente FTP como o FileZilla, ou você pode usar o gerenciador de arquivos do cPanel da sua hospedagem WordPress. Se você é um usuário SiteGround, então você pode usar o painel Site Tools em vez disso.
Se esta é a primeira vez que você usa FTP, então você pode ver nosso guia completo sobre como se conectar ao seu site usando FTP.
Uma vez conectado, vá para /wp-content/themes/ e abra a pasta do seu tema WordPress atual.
Os temas do WordPress são compostos por diferentes modelos, portanto, você precisará editar todos os modelos que incluem uma barra lateral. Para descobrir quais arquivos você precisa editar, consulte nosso guia sobre a hierarquia de modelos do WordPress.
Por exemplo, você pode precisar editar index.php, page.php, single.php, archive.php, home.php, e assim por diante.
Para editar um arquivo, abra-o em um editor de texto como o Bloco de Notas. Em seguida, encontre a linha que se parece com isto:
<?php get_sidebar(); ?>
Se o seu tema tiver várias barras laterais, o código será ligeiramente diferente e pode haver várias partes de código de barra lateral. Normalmente, esse código terá a palavra 'sidebar' dentro da função, por exemplo:
<?php get_sidebar('footer-widget-area'); ?>
Você pode simplesmente excluir a linha da barra lateral que deseja remover.
Agora, salve e carregue o arquivo de volta para sua conta de hospedagem WordPress. Você agora pode repetir este processo para todos os arquivos de modelo que possuem uma barra lateral.
Quando terminar, visite sua loja online, blog ou site para ver a mudança em ação.
Você pode notar que, embora as barras laterais tenham desaparecido, sua área de conteúdo ainda tem a mesma largura, o que deixa a área da barra lateral vazia.
Isso acontece quando o tema tem uma largura definida para a área de conteúdo. Após remover a barra lateral, você pode precisar ajustar a largura da área de conteúdo adicionando CSS personalizado ao seu tema WordPress.
Para fazer isso, vá em Aparência » Personalizar. No menu à esquerda, clique em CSS Adicional.
Agora você pode colar o seguinte código no pequeno editor de código:
.content-area {
width: 100%;
margin: 0px;
border: 0px;
padding: 0px;
}
.content-area .site {
margin:0px;
}
Com isso feito, clique no botão ‘Publicar’. Agora, visite seu site e você verá que a área de conteúdo ocupa 100% do espaço disponível.
Método 4. Removendo Barras Laterais de Páginas Individuais no WordPress
Você pode querer remover a barra lateral apenas em páginas específicas, enquanto ainda a exibe em outras áreas do seu site. Por exemplo, muitos sites não exibem a barra lateral em sua página de checkout, pois isso pode distrair os compradores e impedi-los de concluir a compra.
Se você deseja remover a barra lateral apenas de uma página específica, recomendamos o uso de um construtor de páginas como o SeedProd.
O SeedProd permite que você crie qualquer tipo de página usando um editor simples de arrastar e soltar. Isso facilita adicionar e remover a barra lateral de qualquer página.
No editor do SeedProd, clique para selecionar a barra lateral que você deseja remover. Em seguida, clique no ícone da lixeira.
Se você deseja remover a barra lateral de todo o seu site, você também pode usar o SeedProd para criar facilmente um tema personalizado que não tenha barras laterais.
Para instruções mais detalhadas, consulte nosso guia sobre como criar uma página personalizada no WordPress, usando o SeedProd.
Método 5. Removendo Barras Laterais de uma Página Estática no WordPress
Alguns temas do WordPress vêm com múltiplos modelos, incluindo modelos de página de largura total que não mostram a barra lateral em nenhum dos lados do conteúdo. Você pode usar esses modelos para remover a barra lateral de qualquer página.
Para ver se o seu tema tem um modelo de largura total, basta abrir qualquer página. No menu do lado direito, clique no link ao lado de ‘Modelo’.
No pop-up que aparece, abra o menu suspenso e procure por um modelo de largura total.
Se encontrar um, clique nele para aplicar o modelo a esta página.
Se o seu tema não tiver um modelo de largura total, você pode criar um manualmente.
Abra um editor de texto simples como o Bloco de Notas e cole o seguinte código em um arquivo em branco:
<?php
/*
*
Template Name: Full-Width
*/
get_header(); ?>
Agora você pode salvar este arquivo com o nome full-width.php.
Depois disso, conecte-se ao seu site usando um cliente FTP ou o gerenciador de arquivos fornecido pelo seu provedor de hospedagem WordPress.
Em seguida, vá para /wp-content/themes/ e abra a pasta do seu tema atual. Dentro desta pasta, encontre o arquivo page.php e abra-o em qualquer editor de texto.
Agora, copie tudo o que aparece após a linha <?php get_header(); ?> e cole-o no seu arquivo full-width.php.
Depois de fazer isso, encontre e exclua a linha que se parece com isto:
<?php get_sidebar(); ?>
Agora você pode salvar suas alterações e fazer o upload do arquivo full-width.php para a pasta do seu tema.
Com isso feito, você pode usar este modelo com qualquer página seguindo o mesmo processo descrito acima.
Observação: Se você tiver uma página aberta no editor de conteúdo enquanto cria o arquivo full-width.php, você terá que atualizar o editor antes que o novo modelo apareça no menu suspenso.
Para mais detalhes, veja nosso guia sobre como criar um modelo de página de largura total no WordPress.
Método 6. Remova a Barra Lateral de um Post Único no WordPress
O WordPress também possui modelos de postagem, que funcionam de forma semelhante aos modelos de página.
Se você quiser remover a barra lateral de certas postagens individuais, você pode criar um modelo personalizado de postagem individual. Isso é semelhante à criação de um modelo de página de largura total.
Primeiro, você precisará criar um novo arquivo de modelo usando um editor de texto como o Bloco de Notas. Depois de fazer isso, você pode copiar e colar o seguinte código neste arquivo:
<?php
/*
* Template Name: Featured Article
* Template Post Type: post, page, product
*/
get_header(); ?>
Este código cria um novo modelo chamado ‘Artigo em Destaque’ e o disponibiliza para qualquer página ou post, além de tipos de post de produto em sua loja online.
Em seu modelo personalizado de post único, você simplesmente precisa remover a parte da barra lateral do código. Para mais informações, siga os passos descritos em nosso guia sobre como criar modelos personalizados de post único no WordPress.
Quando terminar, salve este arquivo como full-width.php.
Em seguida, você precisa fazer o upload do arquivo para a pasta do seu tema WordPress atual usando um cliente FTP ou gerenciador de arquivos.
Depois de fazer isso, você pode aplicar este modelo a qualquer post. No menu do lado direito, basta clicar no link ao lado de ‘Modelo’.
No pop-up que aparece, abra o menu suspenso e escolha o modelo de largura total que você acabou de criar.
Depois disso, basta clicar em ‘Atualizar’ ou ‘Publicar’ para tornar suas alterações visíveis.
Tutorial em Vídeo
Você aprende melhor visualmente? Confira nosso tutorial no YouTube sobre como remover facilmente a barra lateral no WordPress:
Esperamos que este artigo tenha ajudado você a aprender como remover facilmente a barra lateral em seu tema WordPress. Você também pode querer ver nosso guia passo a passo sobre como adicionar widgets personalizados após o post no WordPress e os melhores temas WordPress compatíveis com Gutenberg.
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.
Dennis Muthomi
Eu uso barras laterais nas minhas postagens de blog para exibir um sumário que fica fixo enquanto os usuários rolam. E isso REALMENTE melhora os cliques em postagens mais longas.
Mas, eu removi as barras laterais de algumas páginas, como minhas páginas principais de vendas ou conversão.
Nelas, as barras laterais eram muito distrativas e ocupavam um espaço valioso.
Jiří Vaněk
Eu geralmente tento remover a barra lateral no momento em que o site não é como um blog clássico, mas sim um portfólio de negócios ou pessoal. Eu geralmente tento fazer isso usando o editor de templates, mas onde isso não é possível, ou essa opção está faltando, este guia é muito útil. Obrigado pelas dicas de como fazer isso de várias maneiras.
WPBeginner Support
Fico feliz que você tenha achado nossas dicas úteis!
Admin
Conny Dijkstra
Muito obrigado pela sua extensa explicação! Eu só queria remover um widget que aparecia em uma página. E você me deu a solução certa. Defina seu template para largura total para essa página.
Você alegrou meu dia!
É ótimo que você dedique tanto tempo para ajudar outras pessoas.
WPBeginner Support
Glad our guide was able to help
Admin
frespaniol
Eu tentei com o tema Twenty Sixteen, mas não funciona.. é normal..?
WPBeginner Support
O tema pode ter um local diferente onde ele adiciona a barra lateral. Se você entrar em contato com o suporte do tema, eles normalmente podem informar onde o código da barra lateral é adicionado.
Admin
Stacey Beckles
Seus posts são sempre uma salvação.
WPBeginner Support
Glad you find them helpful
Admin
Gary
Os usuários podem simplesmente ativar o alternador no front-end para mostrar ou ocultar a barra lateral eles mesmos?
Sergio
Obrigado!
Eray
Existe alguma forma de desativar a barra lateral no celular? Tenho um tema responsivo e no celular ele se molda naturalmente. Mas quando rolo para baixo, vejo o widget da barra lateral “últimos artigos” lá.
Na visualização do desktop, está tudo bem, mas no celular ele exibe outros blocos, que são suficientes, mas também barras laterais. Posso desativá-lo para celulares? Obrigado.
Hussain
Mais um post claro e útil. Muito obrigado.
Tenho duas perguntas:
1- O tema que estou usando, a saber, oceanwp, tem a opção de remover a barra lateral, mas simplesmente não funciona. Qual é o motivo possível?
1- Consegui remover a barra lateral usando o arquivo index.php. Se houver uma atualização para o tema. A mudança é reversível?
Atenciosamente
Max
Existe alguma maneira de remover a barra lateral/rodapé usando hooks? Por exemplo, usando remove_action();?
Steff
Você é uma lenda absoluta!
David Riewe
O template personalizado remove a barra lateral, mas não está usando a largura total.
Patricia
Por favor, me ajude? Estou tentando remover a barra lateral de todas as páginas, exceto do index.php. Seguir estas instruções funciona maravilhosamente, mas alterar a largura da área de conteúdo para 100% empurra a barra lateral para o final do index.php. Como eu excluo o index.php da alteração da largura da área de conteúdo?
Girik
Olá Equipe
Estou procurando uma solução para remover a barra lateral da página inicial, onde a página inicial está definida como o último post. Você tem?
Susan Taunton
Adoro seus tutoriais em vídeo – eles são sempre cristalinos e informativos. E seus tópicos são com tanta frequência precisamente relevantes para minhas necessidades. Obrigado!!
VIva la WPBeginner!!!
Mateo
Tenho um problema, quero definir largura total, mas quando faço isso, minha página inicial também fica em largura total (certamente porque não uso trecho, em vez disso uso the_content() para obter o conteúdo na página inicial).. como posso fazer uma largura total com este problema...
Linda
Muito obrigado por me ajudar a me livrar da barra direita. Mas agora não consigo mostrar meu blog em tela cheia. Ele é chamado de “home” no menu, mas não existe quando rolo em “sides” como você mostra aqui. Você pode me ajudar a consertar isso no código?
katma
É isso que eu estou procurando!!!
Mas o problema é encontrar a classe CSS.
Tentei com CSS Hero. Consegui encontrar o nome da classe CSS, mas não consegui fazer isso com a função de adicionar CSS personalizado.
Posso otimizar a largura para telefone, posição vertical e horizontal de tablet e PC.
Terry
Em vez de excluir o código, é mais seguro e recomendado comentá-lo.
Adicione o seguinte // na frente de cada instância da chamada get_sidebar e as barras laterais pararão de ser exibidas sem interromper o código.