Elementor com tela cinza: como corrigir o editor

Tipo Page Builders

Nome do erro Elementor com tela cinza ou carregando infinito EN: Elementor grey screen or infinite loading

Severidade Grave

Descrição O Elementor com tela cinza ou carregando infinito mostra o painel de widgets à esquerda, mas a área de preview fica cinza e nunca renderiza a página. A causa quase sempre é o JavaScript do preview bloqueado por minificação/cache, um conflito de plugin ou tema, ou a URL do site inconsistente (http e https misturados).

O que é o Elementor com tela cinza ou carregando infinito?

A tela cinza do Elementor acontece quando o editor abre o painel lateral, mas o iframe de preview (onde a página é montada) não carrega: fica cinza ou preso na animação de carregamento. O preview é uma página separada que o editor injeta num iframe; se o JavaScript dela é bloqueado, se há conflito de script, ou se a URL não bate com a do site, o iframe não renderiza.

Como identificar

O painel de widgets aparece à esquerda, mas a área de preview fica totalmente cinza.
A animação de carregamento do preview gira sem parar (“carregando infinito”).
O console do navegador mostra erro de conteúdo misto (mixed content) ou bloqueio de script.
O editor funciona em outro navegador ou em aba anônima, o que indica cache/extensão.

Antes de começar: Antes de trocar as URLs para https em Configurações > Geral, confirme que o certificado SSL está ativo e válido: salvar uma URL https sem SSL funcionando deixa o site inacessível e exige correção pelo wp-config.php.

Como prevenir

Mantenha o site inteiramente em https com a URL canônica única em Configurações > Geral
Exclua o Elementor da minificação e combinação de JS no plugin de cache desde o início
Atualize Elementor, tema e plugins em staging para flagrar conflitos de JavaScript antes da produção

Causa

Minificação ou combinação de JavaScript pelo plugin de cache quebrando os scripts do preview.
URL do site inconsistente (http no preview e https no site) gerando bloqueio de conteúdo misto.
Conflito com plugin ou tema que injeta JavaScript com erro e interrompe a renderização do iframe.
Extensão do navegador (bloqueador de anúncios/scripts) barrando o iframe de preview.
Versão de PHP incompatível ou memória insuficiente impedindo o preview de ser gerado.

Como resolver

Teste em aba anônima: abra o editor numa janela anônima sem extensões. Se a tela cinza some, o culpado é uma extensão do navegador ou cache local; limpe-os.
Desligue minificação de JS: no plugin de cache, exclua o Elementor da minificação e da combinação de JavaScript, ou desative o cache para testar.
Padronize a URL para HTTPS: em Configurações > Geral, deixe a URL do WordPress e a do site idênticas em https. Preview em http dentro de site https vira conteúdo misto bloqueado.
Ative o Modo de Segurança: em Elementor > Ferramentas > Modo de Segurança, que carrega o editor sem o tema e sem outros plugins. Se renderizar, há conflito a isolar.
Regenere CSS e dados: em Elementor > Ferramentas > Regenerar arquivos e dados, para recriar o CSS corrompido que pode travar o preview.

PHP

// wp-config.php - forca o admin e o preview do Elementor em HTTPS (antes de "That's all")
define( 'FORCE_SSL_ADMIN', true );
if ( isset( $_SERVER['HTTP_X_FORWARDED_PROTO'] ) && $_SERVER['HTTP_X_FORWARDED_PROTO'] === 'https' ) {
  $_SERVER['HTTPS'] = 'on';
}

Perguntas frequentes

O painel aparece mas o preview fica cinza. Por quê?

O preview é um iframe separado. O painel carrega, mas o iframe não renderiza porque o JavaScript dele foi bloqueado (minificação, conflito ou conteúdo misto). Comece desativando a minificação de JS e testando em aba anônima.

Tela cinza e carregando infinito são o mesmo problema?

Quase sempre sim: ambos indicam que o iframe de preview não terminou de renderizar. As causas se sobrepõem (JS bloqueado, conflito, URL inconsistente), então a mesma sequência de correção resolve os dois.

Por que funciona em aba anônima?

A aba anônima ignora cache local e desativa extensões. Se o editor abre nela, o problema é uma extensão (bloqueador) ou o cache do navegador, não o servidor. Limpe o cache e revise as extensões.

O que é conteúdo misto e por que trava o preview?

É quando uma página https carrega recursos via http. O navegador bloqueia esses recursos por segurança. Se o preview do Elementor é servido em http dentro de um site https, o iframe é bloqueado e fica cinza.

O Modo de Segurança ajuda na tela cinza?

Ajuda a diagnosticar. Ele carrega o editor sem tema e sem outros plugins. Se o preview renderiza no Modo de Segurança, há um conflito de tema ou plugin a ser isolado ativando um a um.

Plugin de cache causa a tela cinza?

Sim, com frequência. A minificação e a combinação de JavaScript quebram os scripts do preview do Elementor. Exclua o editor dessas otimizações ou desative o cache para confirmar.

Atenção

Como corrigir o Relationship Field no ACF PRO

O Relationship field do ACF PRO que não funciona acontece quando get_field() devolve um array inesperado, o loop com setup_postdata mostra o post errado por falta de wp_reset_postdata, ou a meta_query usa igualdade em vez de LIKE no valor serializado.

Grave

Como corrigir o JetWooBuilder que não edita templates de produto

O JetWooBuilder não aplica o template de produto quando a opção Enable custom product single page não foi marcada em WooCommerce, Settings, JetWooBuilder, quando os widgets de Single Product estão desativados, ou quando o template está salvo como rascunho. Sem isso a loja mantém o layout padrão do tema.

Grave

Como corrigir Custom Layouts que não aplicam no Astra Pro

Quando os Custom Layouts do Astra não aplicam, um cabeçalho, rodape, hook ou template do Site Builder do Astra Pro fica invisivel em páginas especificas, mesmo salvo. A causa quase sempre esta nas Display Rules: alvo errado em Display On, exclusão em Do Not Display On vencendo, ou outro layout com prioridade maior assumindo o local.

Grave

Como corrigir o Happy Addons que não carrega no Elementor

Quando o Happy Addons não carrega, os widgets do plugin somem do painel do editor Elementor, em geral porque foram desativados no Feature Controller, porque a versão do Elementor ficou abaixo da exigida ou porque o cache de assets do editor ficou desatualizado.

Atenção

Como corrigir o erro de Export/Import com JSON corrompido no ACF PRO

O erro de export/import com JSON corrompido no ACF PRO ocorre quando o arquivo .json do grupo de campos chega malformado, sem a chave key esperada ou com modified inconsistente, fazendo o ACF recusar a importação ou não exibir a sincronizacao.

Grave

Como corrigir o conflito entre Elementor e WP Rocket no WordPress

O conflito entre Elementor e WP Rocket aparece quando a otimização de JavaScript e CSS do cache atinge os arquivos do construtor: o editor do Elementor não abre, o layout quebra no frontend ou widgets e icones somem ao limpar o cache. A causa não e bug de nenhum dos dois, e otimização agressiva sobre o que o Elementor precisa.

Setores

Extensões

Integrações

Como corrigir Elementor com tela cinza ou carregando infinito

O que é o Elementor com tela cinza ou carregando infinito?

Como identificar

Como prevenir

Causa

Como resolver

Perguntas frequentes

Itens relacionados

Como corrigir o Relationship Field no ACF PRO

Como corrigir o JetWooBuilder que não edita templates de produto

Como corrigir Custom Layouts que não aplicam no Astra Pro

Como corrigir o Happy Addons que não carrega no Elementor

Como corrigir o erro de Export/Import com JSON corrompido no ACF PRO

Como corrigir o conflito entre Elementor e WP Rocket 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