Aperfeiçoar o layout do seu site WordPress pode dar muito trabalho, mas também é essencial para a Experiência do Usuário (UX), engajamento e conversões. Portanto, pode ser frustrante quando um erro aparentemente aleatório causa uma interrupção na exibição do seu site — como sua barra lateral de repente aparecendo abaixo do conteúdo em vez de ao lado.
Embora existam algumas causas potenciais, geralmente se resume a problemas com a Linguagem de Marcação de Hipertexto (HTML) ou Folhas de Estilo em Cascata (CSS). Felizmente, os problemas são relativamente fáceis de resolver, para que você possa rapidamente colocar seu site em excelente forma.
Neste artigo, vamos analisar as causas comuns deste erro e depois mostrar como resolvê-lo em três passos simples. Vamos começar!
Causas Comuns da Barra Lateral Cair Abaixo do Conteúdo no WordPress
As barras laterais no WordPress são áreas de conteúdo destinadas a serem exibidas à esquerda ou à direita do segmento principal da página (ou às vezes em ambos). Elas geralmente contêm widgets, formulários de inscrição, links para postagens relacionadas ou conteúdo semelhante que você gostaria de incluir em todo o site.
Devido a vários bugs ou erros, suas barras laterais podem às vezes aparecer na parte inferior da página, em vez de à esquerda ou à direita. Escusado será dizer que isso pode facilmente arruinar um website bem projetado.
A principal causa desse comportamento são problemas com o HTML ou CSS do seu site. Geralmente é resultado de alterações diretas que você fez no código do seu site, como um arquivo de tema ou plugin.
Por exemplo, talvez haja uma tag <div> extra ou não divulgada na página. O problema pode até ser atribuído a configurações incorretas de largura e flutuação no seu CSS. Felizmente, corrigir esse erro é fácil o suficiente.
Evite o Estresse
Evite solução de problemas ao se inscrever no DreamPress. Nossos especialistas amigáveis em WordPress estão disponíveis 24/7 para ajudar a resolver problemas do site — grandes ou pequenos.
Veja os PlanosComo Corrigir o Erro da Barra Lateral do WordPress Abaixo do Conteúdo (Em 3 Passos)
Agora que você conhece as possíveis causas deste erro perplexo, é hora de corrigi-lo. Recomendamos seguir os três passos seguintes em ordem, passando para o próximo apenas se o anterior não funcionar. Antes de começar, lembre-se de fazer um backup do seu site por precaução.
Etapa 1: Desfaça Suas Alterações Mais Recentes
O primeiro passo também é o mais simples. Se a sua barra lateral se moveu após fazer uma alteração no seu site — seja instalando um novo plugin, adicionando código personalizado ou qualquer outra coisa — simplesmente desfaça. Reverter a ação restaura o layout ao formato original e ajuda a isolar a causa do problema.
Assim, você pode começar revertendo a alteração e atualizando seu site para ver se a barra lateral está de volta ao seu lugar correto. Se estiver, você pode então procurar por problemas potenciais com as alterações que estava tentando fazer. Por exemplo, se você instalou um novo plugin, verifique alternativas. Se você alterou ou adicionou ao código do seu site, procure por quaisquer erros de digitação ou erros de sintaxe.
Passo 2: Corrigir Tags <div> Não Fechadas ou Remover Tags <div> Extras
Muitas vezes, uma tag <div> não fechada ou extra no código do seu site é a causa do erro da barra lateral do WordPress. Essas tags HTML definem os limites das seções no seu site. Se estiverem colocadas incorretamente, os navegadores não renderizarão o site adequadamente (daí a barra lateral errante).
Aqui está um exemplo de uma página formatada corretamente:
Abaixo está a mesma página com uma tag <div> não fechada:
Você pode ver que o que deveria ser a tag de fechamento <div> está faltando a barra. Como resultado, o navegador não sabe que ela deve ser fechada, e o conteúdo que deveria estar fora do elemento agora está dentro.
Para corrigir isso, verifique todos os arquivos de template que você modificou em busca de tags faltando ou extras. Geralmente, esses erros podem ser encontrados nos arquivos de “partes do template” do seu tema do WordPress. Para chegar lá, vá até o seu Painel do WordPress e navegue até Aparência > Editor de Temas.
Escolha o tema correto no menu suspenso no topo e, em seguida, localize a seção de partes do modelo na barra lateral.
Os modelos que geram páginas e postagens geralmente estão sob a seção conteúdo. Encontre o que você precisa na lista, verifique-o e faça as correções necessárias. Então você pode clicar em Atualizar Arquivo para salvar suas alterações.
Se você sabe qual arquivo editou, pode ir diretamente para lá. Caso contrário, precisará verificar todos eles em busca de inconsistências.
Etapa 3: Corrigir Problemas de CSS
Outra causa frequente deste erro é encontrada no CSS do seu site. A seção CSS Adicional do Personalizador do WordPress permite que você adicione CSS personalizado ao seu site.
Se você usou este recurso ou editou o CSS por outros meios, pode ter formatado o código incorretamente. No caso de mover sidebars, o culpado mais comum é a propriedade “width”.
Você deve verificar novamente que a soma das larguras dos elementos Conteúdo e Sidebar não exceda a largura do elemento Wrap . Se isso ocorrer, o elemento menor será empurrado para baixo para se ajustar.
Ferramentas para Facilitar a Solução de Problemas da Barra Lateral
Você também pode solucionar o problema por conta própria sem usar código. Existem várias ferramentas online que podem validar seu código e verificar se há erros.
Você pode usar o Serviço de Validação de Marcação W3C para verificar o código HTML. O Serviço de Validação CSS W3C é o equivalente para CSS. Verificação Online de Web também é uma excelente ferramenta que funciona para ambos, HTML e CSS.
Esses serviços são também fantásticos se você apenas deseja um segundo par de olhos no seu código, independentemente do nível de habilidade. Uma rápida verificação dupla nunca prejudicou ninguém!
Você também pode tirar a correção de erros do WordPress da sua lista de tarefas com o nosso serviço DreamCare. Nossa equipe de especialistas cuida de tudo no backend do seu site para garantir que ele esteja seguro, protegido e sempre funcionando.
Recursos Adicionais do WordPress
Diga adeus a links quebrados e mensagens de erro! Preparamos vários guias para ajudá-lo a solucionar todos os tipos de problemas do WordPress:
- Visão Geral dos Erros Comuns no WordPress
- Como Corrigir o Erro 500 de Servidor Interno no WordPress
- Como Corrigir Erros de Sintaxe no WordPress
- Como Resolver o Problema de Não Envio de Email pelo WordPress
- Como Corrigir o Erro de Conexão com a Base de Dados no WordPress
- Como Corrigir o Erro 404 Não Encontrado no WordPress
- Como Corrigir Texto Branco e Botões Desaparecidos no Editor Visual do WordPress[b]
Se você está procurando por mais dicas e truques do WordPress, confira nossos Tutoriais do WordPress, uma coleção de guias que ajudarão você a navegar pela área administrativa do WordPress como um profissional.
Resolvendo o Erro da Barra Lateral
Se você dedicou tempo para construir um belo site WordPress, provavelmente não quer nada que atrapalhe — especialmente erros repentinos. Felizmente, se o problema é que suas barras laterais estão aparecendo abaixo do seu conteúdo, a solução é relativamente simples!
Para corrigir o erro da barra lateral que aparece abaixo do conteúdo, você pode seguir estes três passos:
- Desfaça quaisquer alterações que você fez em seu site logo antes do erro aparecer.
- Verifique e corrija tags <div> não fechadas ou extras em seu código.
- Verifique se o CSS do seu site está correto.
Se você prefere gastar seu tempo trabalhando em seu negócio em vez de solucionar problemas no seu site, considere mudar para o DreamPress. Com nossos planos de Hospedagem Gerenciada do WordPress, cuidamos dos problemas para você, para que possa se concentrar no que realmente importa.
