As display conditions no Elementor decidem onde cada template do Theme Builder aparece, via regras de incluir e excluir. A documentação oficial do Elementor confirma que o recurso é exclusivo do Theme Builder do Pro e que a condição mais específica vence a mais ampla. Ele cobre site inteiro, singulares e arquivos. Configure por especificidade para não quebrar o layout.

As display conditions no Elementor são as regras que definem em quais páginas, posts e arquivos um template do Theme Builder é exibido. Em vez de aplicar um cabeçalho ou rodapé igual em todo o site na unha, você diz ao Elementor Pro onde aquele design deve ou não aparecer. São três categorias práticas: site inteiro, conteúdo singular e arquivos. Quem domina esse recurso para de duplicar templates e ganha controle fino sobre cada seção. Este guia faz parte de todos os artigos de Elementor da FULL e mostra os tipos, o passo a passo e os erros que mais chegam ao suporte.

Primeiros passos: Visão geral das display conditions

As display conditions no Elementor vivem dentro do Theme Builder e só existem no Elementor Pro: ao publicar 1 template, abre-se um painel onde você define em quais URLs ele aparece, com dois verbos (incluir e excluir) e três níveis de alcance. Sem nenhuma condição, o template fica inativo.

Essa estrutura resolve a maioria dos casos de personalização sem uma linha de código. Você combina um incluir amplo com exclusões pontuais e cobre cabeçalho, rodapé, single e arquivo num só lugar. A tabela abaixo resume o modelo mental antes de qualquer ajuste no site.

Quem está começando deve ler primeiro o nosso tutorial de Elementor para iniciantes e só depois mexer no Theme Builder, porque condições mal configuradas afetam o site inteiro de uma vez.

Por que display conditions no Elementor importam

Configurar display conditions no Elementor importa porque um único erro de alcance afeta as 100% das páginas de uma vez. Um page builder como o Elementor Pro renderiza o template global em cada requisição, então um cabeçalho com a condição errada aparece até no checkout, quebrando a conversão.

Na prática, vemos nos tickets de suporte da FULL que a maioria dos problemas de layout duplicado nasce de uma condição ampla sem regra de exceção. Há também um ganho de performance: templates aplicados só onde fazem sentido reduzem CSS e JS por página e ajudam os Core Web Vitals. Outro motivo é a hierarquia: o Elementor resolve conflitos pela condição mais específica, então um único excluir mal colocado pode derrubar o cabeçalho de uma seção inteira sem aviso. Por isso vale tratar cada template como um contrato de onde ele pode e não pode aparecer. Vale comparar com o Elementor frente ao Gutenberg para entender o custo de cada modelo.

Os 3 tipos de display conditions no Elementor

Os 3 tipos de display conditions no Elementor são site inteiro, singular e arquivo, e cada um responde a uma pergunta diferente sobre onde o template aparece. Em mais de 167 conteúdos de Elementor publicados pela FULL, esses três alcances cobrem praticamente todo caso real de personalização. A escolha do tipo certo evita que você empilhe templates concorrentes que disputam a mesma URL.

O tipo site inteiro aplica o template em todas as URLs públicas e é o padrão para cabeçalho e rodapé globais. O tipo singular mira um conteúdo único ou um tipo de post inteiro, como todos os posts ou uma página específica, ideal para um single de blog diferente do resto. O tipo arquivo atinge listagens: categorias, tags, busca e páginas de autor, útil quando o arquivo do blog precisa de layout próprio. Sobre os três, a regra de exclusão remove pontos específicos, e essa combinação de incluir mais excluir dá precisão cirúrgica. Para layouts dinâmicos, o Crocoblock no Elementor estende esses gatilhos com regras condicionais extras.

Passo a passo: Configurar display conditions no Elementor

Configurar display conditions no Elementor leva menos de três minutos por template e segue sempre a mesma sequência: criar o template, publicar, definir o alcance e validar. O fluxo abaixo vale para cabeçalho, rodapé, single e arquivo no Theme Builder do Elementor Pro. Faça um template por vez para isolar qualquer conflito antes de seguir para o próximo.

Legenda: a tela de condições aparece no momento de publicar o template, definindo onde o design vai aparecer.

Passo 1: Abra o theme builder do Elementor pro

Acesse o painel do WordPress, vá em Templates e abra o Theme Builder do Elementor Pro. Escolha o tipo de template (cabeçalho, rodapé, single, arquivo, popup) e desenhe o layout normalmente com os widgets do editor. Só o Pro libera o Theme Builder; a versão gratuita não tem display conditions. Salve o rascunho antes de publicar para não perder o trabalho.

Passo 2: Clique em publicar e adicione a condição

Ao clicar em Publicar, o Elementor abre o painel de condições. Clique em adicionar condição e escolha entre incluir ou excluir. Selecione o alcance: site inteiro, singular ou arquivo. Para um cabeçalho global, use incluir site inteiro. Cada template aceita várias condições, então você pode incluir um conjunto e excluir uma URL pontual na mesma tela.

Passo 3: Refine com regras de exclusão

Adicione uma segunda linha com excluir para tirar o template de pontos específicos, como a página de login, o checkout do WooCommerce ou uma landing page que já tem header próprio. A regra mais específica vence a mais ampla, então excluir uma página sempre supera o incluir site inteiro. Salve e o Elementor aplica a hierarquia automaticamente, sem plugin extra.

Como validar e testar as display conditions

Validar as display conditions no Elementor exige abrir o site numa aba anônima e percorrer pelo menos quatro tipos de URL: home, um post, uma página e um arquivo de categoria. Em testes que acompanhamos no suporte, a maioria dos conflitos de template aparece só quando você navega como visitante, fora do editor. O preview interno do Elementor não mostra a sobreposição de regras; só a navegação real revela.

Use o inspetor do navegador para confirmar qual template carregou em cada URL e cheque se nenhum cabeçalho duplicou. Ferramentas como o PageSpeed Insights e o GTmetrix ajudam a medir se templates extras estão injetando CSS desnecessário. Se um single de blog ficou sem o layout esperado, a condição singular provavelmente perdeu para uma regra de site inteiro mais antiga. Documente cada condição numa planilha simples quando o site passar de dez templates, porque a memória não escala. O nosso guia sobre por que o Elementor fica lento detalha como templates sobrepostos pesam no carregamento.

Erros comuns ao usar display conditions

O erro mais comum com display conditions no Elementor é usar incluir site inteiro em tudo e nunca adicionar regras de exclusão, o que faz um template invadir páginas que já têm layout próprio. Esse padrão responde por boa parte dos chamados de site quebrou depois que mexi no Theme Builder que chegam à FULL. A correção quase sempre é uma única linha de excluir.

Outro erro recorrente é criar dois templates do mesmo tipo com condições que se sobrepõem sem entender a prioridade: quando duas regras valem para a mesma URL, o Elementor aplica a mais específica, não a mais recente. Templates antigos com condição ampla também continuam ativos e disputam a renderização em silêncio. Um terceiro problema é esquecer de excluir páginas transacionais, como checkout e login, do cabeçalho global, o que atrapalha conversão e formulários. Veja também como criar pop-ups no Elementor sem que a condição do popup colida com a do cabeçalho.

Ative o Elementor pro com display conditions sem comprar a licença avulsa

As display conditions no Elementor só existem no Elementor Pro, e a licença avulsa custa caro quando você soma a renovação anual. No plano PRO da FULL, por R$849,90, você ativa o Elementor Pro junto com outros 16 plugins premium num só painel. Distribuindo o bundle entre dez projetos, dá cerca de R$85 por site.

Esse valor por site fica bem abaixo da soma das licenças avulsas, que passam de US$59 cada por ano só no Elementor Pro. Em vez de gerenciar uma chave de licença por plugin, você liga tudo em um clique e mantém o Theme Builder, o Rank Math PRO e o resto do pacote sempre atualizados, sem renovação manual. É o caminho mais barato para usar display conditions no Elementor em vários sites de uma agência. Compare as faixas e veja o que cada plano libera em FULL.services/planos.

Display conditions com WooCommerce e tipos de post personalizados

Quando o site roda WooCommerce, as display conditions no Elementor ganham alcances extras: você consegue mirar a página de produto, o carrinho, o checkout e o arquivo de loja como condições próprias, separadas das páginas comuns. Isso evita que um cabeçalho global vaze para o checkout e atrapalhe a conversão, um dos cenários que mais aparece no suporte.

O mesmo vale para tipos de post personalizados criados por plugins ou por código. Cada custom post type vira um alvo de condição singular, então um single de portfólio ou de imóvel pode ter template próprio sem afetar o blog. A regra prática continua a mesma: parta de um incluir amplo, refine com excluir nos pontos sensíveis e teste cada tipo navegando como visitante. Quanto mais tipos de conteúdo o site tem, mais a hierarquia de especificidade importa, porque é ela que decide qual template ganha quando duas condições disputam a mesma URL.

Perguntas frequentes sobre display conditions no Elementor

Próximos passos para dominar o theme builder

Dominar as display conditions no Elementor é o que separa um site montado na unha de um projeto realmente escalável no Theme Builder. Comece com um cabeçalho global usando incluir site inteiro mais excluir nas páginas transacionais, valide navegando como visitante em quatro tipos de URL e só depois avance para singles e arquivos. Mantenha cada condição documentada quando o site crescer, porque a hierarquia de prioridade resolve conflitos em silêncio e a memória não acompanha. Para aprofundar, o guia domine o Elementor da FULL reúne os tutoriais na ordem certa, e o artigo sobre o Elementor Pro valer a pena ajuda a decidir o investimento. Estrutura limpa hoje rende controle, performance e manutenção previsível amanhã.