Conflito de header Elementor e Astra: como corrigir

Tipo Page Builders

Nome do erro Conflito de Header Builder entre Elementor Pro e Astra Pro EN: Elementor Pro and Astra Pro Header Builder conflict

Severidade Grave

Descrição O conflito de header entre Elementor Pro e Astra Pro ocorre quando os dois constroem o cabeçalho ao mesmo tempo: o site mostra dois headers empilhados, ou o template de Header do Theme Builder some porque o Astra ainda renderiza o seu. A correção e deixar uma única camada controlar o cabeçalho.

O que é o conflito de Header Builder entre Elementor Pro e Astra Pro?

O conflito de header entre Elementor Pro e Astra Pro acontece porque os dois tem construtor de cabeçalho próprio e ambos tentam renderizar o header na mesma posicao do tema. O Astra Pro monta o Primary Header pelo Header Builder do Customizer, enquanto o Elementor Pro pública um template de Header no Theme Builder com condicoes de exibicao. Quando as duas camadas ficam ativas para a mesma URL, o WordPress imprime os dois cabeçalhos um sobre o outro, ou o template do Elementor parece não aparecer porque o header do Astra ocupa o topo. Os plugins funcionam isolados; o erro nasce da sobreposicao. A correção consiste em escolher quem controla o cabeçalho e desligar a outra camada para aquela condicao de exibicao, sem desinstalar nenhum dos dois.

Como identificar

Dois cabeçalhos aparecem empilhados no topo: o Primary Header do Astra Pro acima e o template de Header do Elementor Pro logo abaixo, ou o contrario.
O template de Header publicado no Theme Builder com a mensagem ‘Header was successfully published’ não aparece no frontend porque o Astra continua imprimindo o próprio cabeçalho.
O menu, o logo ou o carrinho aparecem em dobro porque o mesmo menu esta no Header Builder do Astra e no template do Elementor.
O header do Elementor aparece dentro do conteúdo, no meio da página, em vez de no topo, porque o Astra já ocupou a área do cabeçalho.
Em telas mobile o cabeçalho fica com altura dupla e o sticky header trava, porque duas barras concorrem pela mesma posicao fixa.

Antes de começar: Antes de remover o Primary Header no Customizer do Astra ou despublicar templates do Theme Builder, faca backup e teste em staging: as condicoes de exibicao afetam várias páginas de uma vez, e desligar a camada errada pode deixar o site sem cabeçalho e sem menu em todas as URLs até você reverter.

Como prevenir

Defina desde o inicio uma única camada para o cabeçalho: header no Astra Pro ou no Theme Builder do Elementor Pro, nunca nos dois para a mesma condicao de exibicao
Ao publicar um template de Header no Elementor, sempre atribua a condicao de exibicao na mesma hora, para ele de fato substituir o header do tema
Use o mesmo menu em um único local: ou no Primary Menu do Astra, ou no widget Nav Menu do Elementor, nunca nos dois
Atualize o tema Astra, o complemento Astra Pro e o Elementor Pro juntos e valide o cabeçalho em staging antes de aplicar em producao

Causa

Primary Header do Astra Pro ativo no Header Builder do Customizer ao mesmo tempo que um template de Header publicado no Theme Builder do Elementor Pro com a condicao Todo o Site, fazendo os dois cabeçalhos renderizarem juntos.
Template de Header do Elementor publicado sem condicao de exibicao definida, entao ele nunca substitui o header do Astra e o cabeçalho do tema continua aparecendo sozinho.
Condicoes de exibicao sobrepostas: o header do Astra cobre Todo o Site e o template do Elementor cobre apenas Página Inicial, gerando header duplicado so na home e header simples no resto.
Mesmo menu atribuido ao local Primary Menu do Astra e também inserido no widget Nav Menu do template do Elementor, duplicando navegação e logo.
Opção Disable Header não marcada no painel Astra Settings das páginas onde o Elementor Pro deveria assumir o cabeçalho via template próprio.

Como resolver

Decida qual plugin controla o cabeçalho: escolha uma única camada responsável pelo header de todo o site. O Theme Builder do Elementor Pro oferece mais liberdade de design dentro do construtor; o Header Builder do Astra Pro e mais leve. Defina um e siga os proximos passos desligando o outro.
```
Elementor -> Templates -> Theme Builder -> aba Header
Aparencia -> Personalizar -> Header Builder (Astra)
```
Se o Elementor vai controlar, desligue o header do Astra: remova os elementos do Primary Header no Header Builder do Astra para o tema parar de imprimir o cabeçalho. Em seguida abra o template de Header no Theme Builder e atribua a condicao de exibicao correta para ele assumir o topo.
```
Aparencia -> Personalizar -> Header Builder -> remover Site Title, Menu e Logo da linha Primary
Elementor -> Templates -> Theme Builder -> Header -> Display Conditions -> Include -> Entire Site
```
Se o Astra vai controlar, não publique header no Elementor: deixe o Primary Header montado no Header Builder do Astra e remova ou despublique qualquer template de Header no Theme Builder do Elementor para a mesma condicao, evitando que as duas barras coexistam.
```
Elementor -> Templates -> Theme Builder -> Header -> abrir o template -> definir como Rascunho ou excluir
Conferir que nenhum template de Header tem Display Conditions ativas para a URL afetada
```
Esconda o header do Astra apenas em páginas pontuais: quando o Elementor so deve controlar o cabeçalho em algumas páginas, e não no site inteiro, use o painel Astra Settings de cada página para desabilitar o header so naquela URL, mantendo o header do Astra no restante do site.
```
Editor da página -> painel Astra Settings -> Disable Sections -> marcar Disable Header
Salvar a página e conferir o frontend so com o header do Elementor
```

PHP

<?php
/**
 * Esconde o Primary Header do Astra quando o Elementor Pro deve assumir o cabecalho.
 * Cole no functions.php do tema-filho ou em um plugin de snippets (ex.: Code Snippets).
 * Ajuste a condicao para as URLs onde o template de Header do Elementor controla o topo.
 */
add_action( 'wp', function () {
	// Defina aqui onde o Elementor controla o header (ex.: home e uma pagina por slug).
	$elementor_controla_header = is_front_page() || is_page( 'landing' );

	if ( $elementor_controla_header ) {
		// Remove o Primary Header que o Astra imprime no hook astra_header.
		remove_action( 'astra_header', 'astra_header_markup' );
	}
} );

Perguntas frequentes

Por que aparecem dois cabeçalhos com Elementor Pro e Astra Pro?

Porque o Astra Pro monta o Primary Header pelo Header Builder e o Elementor Pro também pública um template de Header no Theme Builder. Quando as duas camadas ficam ativas para a mesma URL, o WordPress imprime os dois cabeçalhos empilhados. A correção e desligar uma das camadas para aquela condicao de exibicao.

Publiquei o header no Theme Builder e ele não aparece. O que falta?

Faltam as condicoes de exibicao. Um template de Header sem Display Conditions nunca substitui o header do tema. Abra o template no Theme Builder, va em Display Conditions, escolha Include e Entire Site, e confirme que o Primary Header do Astra foi removido no Customizer para o do Elementor assumir o topo.

Como desativar o header do Astra so em uma página?

Abra a página no editor, localize o painel Astra Settings na lateral e marque Disable Header em Disable Sections. Isso esconde o cabeçalho do Astra apenas naquela URL, deixando o template do Elementor controlar o topo so onde você precisa, sem afetar o resto do site.

Preciso desinstalar o Astra Pro para usar o header do Elementor?

Não. Os dois convivem bem quando apenas uma camada monta o cabeçalho. O conflito vem da sobreposicao, não da coexistencia. Basta remover o Primary Header no Header Builder do Astra e atribuir a condicao Entire Site ao template de Header do Elementor para resolver sem desinstalar nada.

O menu e o logo estão duplicados no cabeçalho. Por que?

Porque o mesmo menu esta no Primary Menu do Astra e também no widget Nav Menu dentro do template do Elementor. Cada camada renderiza a própria navegação. Mantenha o menu em um único local: ou no Header Builder do Astra, ou no template do Elementor, nunca nos dois ao mesmo tempo.

O sticky header trava no mobile depois do conflito. Como resolver?

Isso acontece quando duas barras fixas disputam a mesma posicao no topo. Depois de deixar so uma camada controlar o cabeçalho, configure o sticky apenas nela: o Sticky Header do Astra Pro ou o efeito de scroll do template do Elementor. Com um único header fixo, a altura dupla e o travamento somem.

Qual ferramenta e melhor para o header: Astra Pro ou Elementor Pro?

Qualquer uma resolve, desde que seja apenas uma por condicao de exibicao. O Theme Builder do Elementor Pro da mais controle visual dentro do construtor; o Header Builder do Astra Pro e mais leve e carrega mais rápido. O essencial e não deixar as duas montando o mesmo cabeçalho ao mesmo tempo.

Grave

Como corrigir o erro de licença da Crocoblock e reativar

O erro de licença da Crocoblock impede ativar e atualizar os JetPlugins quando a chave não valida no Jet Dashboard, geralmente por limite de sites atingido, URL do site fora do Manage Sites ou conexão de saída bloqueada com o servidor da Crocoblock.

Grave

Como corrigir o erro de Header/Footer no Astra Pro após atualização

O Astra header footer quebrado após atualização ocorre quando o cabeçalho ou rodape do Astra Pro some, perde estilo ou troca de posicao depois de um update do tema ou do Astra Pro Addon. A causa quase sempre e CSS dinamico em arquivo defasado, módulo Custom Layouts desligado, ou regra de exibicao do layout perdida.

Atenção

Como corrigir os estilos conflitantes entre Happy Addons e Astra Pro no WordPress

O conflito de CSS entre Happy Addons e Astra Pro ocorre quando o CSS do tema vence o do widget por especificidade ou ordem de carregamento, deixando fonte, cor e espaçamento dos widgets do Happy Addons diferentes do que foi definido no Elementor.

Grave

Como corrigir conflitos entre o Elementor e plugins de cache

O conflito entre Elementor e cache acontece quando um plugin de cache serve CSS, HTML ou JavaScript antigos, deixando o layout quebrado no frontend ou travando o editor. A correção envolve regenerar o CSS do Elementor, excluir o editor da otimização e limpar o cache na ordem certa.

Grave

Como corrigir o erro ‘Template Not Found’ no Elementor

O erro "Template Not Found" do Elementor surge quando o site tenta carregar um template salvo que não existe mais no banco ou que veio de outro domínio. É comum após migração ou clonagem sem rodar o Replace URL, ou quando o template referenciado foi excluído da biblioteca.

Atenção

Como corrigir os Data Stores do JetEngine que não salvam dados do usuário no WordPress

O JetEngine Data Stores não salva quando o tipo de armazenamento escolhido é por sessao do navegador (Local Storage ou Cookies) e o visitante troca de dispositivo ou limpa o navegador, ou quando o tipo Users esta em uso mas o visitante não esta logado, fazendo os itens adicionados sumirem ao recarregar a página.

Setores

Extensões

Integrações

Como corrigir o conflito de Header Builder entre Elementor Pro e Astra Pro

O que é o conflito de Header Builder entre Elementor Pro e Astra Pro?

Como identificar

Como prevenir

Causa

Como resolver

Perguntas frequentes

Itens relacionados

Como corrigir o erro de licença da Crocoblock e reativar

Como corrigir o erro de Header/Footer no Astra Pro após atualização

Como corrigir os estilos conflitantes entre Happy Addons e Astra Pro no WordPress

Como corrigir conflitos entre o Elementor e plugins de cache

Como corrigir o erro ‘Template Not Found’ no Elementor

Como corrigir os Data Stores do JetEngine que não salvam dados do usuário no WordPress

Setores

Extensões

Integrações

Extensões

Hero Sections

Seções de CTA

Login

Blog

Cabeçalhos

Seções de FAQ

Cadastro

Blog individual

Rodapés

Seções de contato

Seções de preços

Faixas

Portfólio

Seções de equipe

Números

Logotipos