Digamos que sua loja feche às 18:00 e você queira que o botão “Order Now” se transforme em um “Estamos fechados, de volta às 9:00, aviso de” após o expediente Ou a tabela de preços mostra um preço para visitantes logados e outro para membros Você poderia construir duas páginas e trocá-las à mão Ninguém quer fazer isso duas vezes por dia.
A exibição condicional do elementor o corrige: construa ambas as versões na mesma página e, em seguida, anexe uma regra a cada uma que decida quem a vê e quando. O Exibição Extensão das condições em Master Addons adiciona isso a cada elemento Elementor, livre, sem código.
Abaixo: cada tipo de condição, como a lógica AND/OR realmente se comporta, a única configuração que morde silenciosamente as pessoas (Output HTML) e onde essa abordagem fica fora de estrada.
O que a exibição condicional realmente faz
Cada elemento Elementor, seja um contêiner, um widget ou uma coluna, pega um Condições de exibição painel em seu Avançado aba. Ligue e você pode anexar regrasO visitante passa, ele vê o elementoO visitante falha, ele se foi.
Cada regra se lê como uma frase em três partes: o que verificar, um operador (É ou não) e um valor. “Login Status é Logado em.” “Browser não é Safari.” Esse é o modelo inteiro Tudo abaixo é uma variação dele.
Ligue a extensão primeiro
As Condições de Exibição são fornecidas com Complementos Mestres, mas não estão ativas fora da caixa Ir para Complementos Mestres > Configurações > Extensões, encontre-o no grupo Widgets Dinâmicos, alterne-o, salve.
Pule isso e o painel Condições de exibição nunca aparece na guia Avançado, que é de longe a mensagem “it's not working” mais comum que recebemos Se você ainda não tem o plugin, instale complementos mestres gratuitamente em WordPress.org.
A configuração Exibição: todas as condições versus qualquer condição
Habilite as condições de exibição em um elemento e você obterá um Exibir em dropdown com duas escolhas Escolher o errado é a razão mais comum de uma regra “não funciona.”
Todas as condições atendidas é lógica AND, então toda regra tem que passar. Qualquer condição cumprida é lógica OR, então uma regra passageira é suficiente.
Aqui está o que isso significa na prática Digamos que você defina duas condições: “Browser is Chrome” e “User Role is Administrator.”
Em Todas as condições atendidas, apenas um administrador que por acaso está navegando no Chrome vê o elemento Esse mesmo administrador no Firefox não vê nada.
Em Qualquer condição cumprida, cada visitante do Chrome vê, e cada administrador em qualquer navegador também. Esse é um público muito maior do que a maioria das pessoas tem em mente quando adiciona uma segunda regra.
Portanto, se um elemento estiver sendo exibido para as pessoas, não deveria, verifique esse menu suspenso antes de tocar em qualquer outra coisa.
A alternância HTML de saída (leia isso antes de ocultar qualquer coisa sensível)
Sentar bem sob a alternância principal é Saída HTML, e seu próprio rótulo explica o que ele faz: “Se ativado, o código HTML existirá na página, mas o widget será ocultado usando CSS.”
Isso importa muito mais do que sugere sua colocação silenciosa.
Deixe isso desligado, que é o padrão, e o elemento nunca é renderizado Não está na fonte da página de forma alguma Alguém que falha na condição não pode visualizar-fonte e lê-lo, e o Google não irá indexá-lo.
Vire-o em e o elemento é renderizado no HTML e depois oculto com CSS. Qualquer pessoa pode abrir ferramentas de desenvolvimento, excluir uma linha e ler tudo.
Portanto, mantenha o HTML de saída desativado para qualquer coisa que você realmente queira, mantido privado: um preço somente para membros, um link de download oculto, uma nota interna A razão pela qual a configuração existe é que alguns scripts precisam da marcação presente no DOM para funcionar, o que vem com controles deslizantes, sistemas de guias e contadores que medem elementos no carregamento da página Esse é o caso para ativá-lo, e não muito mais.
Enquanto estamos aqui, a versão contundente: display condicional é uma ferramenta de apresentação, não um sistema de controle de acesso Com o HTML de saída desligado é perfeitamente sólido para o uso diário Mas o conteúdo que tem que ser bloqueado, como um curso pago ou um arquivo fechado, pertence atrás da proteção real Restringir widget de conteúdo existe para isso e é adequado Configuração de associação do WordPress é a resposta certa para qualquer coisa pela qual você cobra dinheiro.
Cada condição que você pode usar
Abra o dropdown Condição e você obter quatro grupos.
| Grupo | Condições | Uso típico |
|---|---|---|
| Visitante | Status de login, função do usuário, sistema operacional, navegador | Preços para membros, notas somente para administradores, “Baixar para botões Mac” |
| Data e hora | Intervalo de data, hora do dia, dia da semana | Vendas que expiram, horário de funcionamento, ofertas de fim de semana |
| Single | Página, postagem, página estática, tipo de postagem, postagem tem prazo | Cabeçalho CTA que muda em determinadas páginas |
| Arquivo | Arquivo de Taxonomia, Arquivo de Termo, Arquivo de Tipo de Postagem, Arquivo de Data, Arquivo de Autor, Resultados da Pesquisa | Banners específicos de categoria, uma mensagem sobre resultados de pesquisa vazios |
Cada um deles combina com É ou Não é, o que duplica silenciosamente o que uma única regra pode fazer.
Mostrar conteúdo apenas para usuários logados
Selecione o elemento, abra Avançado > Condições de exibição, ligue-o. A condição padrão já está Status de login definir para É, ou seja, visitantes logados veem e ninguém mais vê. Você não precisa mudar nada.
Agora crie a versão oposta para visitantes logados Selecione esse segundo elemento, habilite as Condições de Exibição e inverta o operador para Não é.
Empilhe esses dois em uma página e você terá um cabeçalho que cumprimenta os membros pelo nome e lança uma inscrição para todos os outros, sem página duplicada para manter sincronizada.
Direcione uma função de usuário específica
Mesmo fluxo, condição diferente. Escolha Papel do usuário a partir do dropdown e escolha a função que você procura: Administrador, Editor, Assinante, Cliente, o que quer que seu site tenha WooCommerce e plugins de associação adicionam suas próprias funções a esta lista.
Vire para Não é Administrador e todos, exceto os administradores, veem o elemento Isso é útil para um “aqui é como editar esta seção” nota que seu cliente vê na página, sem que você precise olhar para ela toda vez que abrir o site.
Uma captura: uma função de usuário só existe para alguém que está logado Um visitante logado não tem função alguma, então uma regra de função de usuário nunca irá igualá-lo, não importa o que você defina Se você precisar pegar pessoas logadas, isso é uma regra de Status de Login.
Mostrar conteúdo por data, hora ou dia da semana
Três condições baseadas no tempo e economizam mais trabalho do que qualquer outra coisa na lista.
Data Faixa leva uma data de início e um fim Construa o banner da Black Friday em outubro, defina o intervalo, esqueça-o Ele aparece e desaparece por conta própria.
Hora do Dia leva uma janela de tempo, que é a troca aberta contra fechada do topo deste artigo.
Dia da Semana leva um ou mais dias, adicionado como tags.
Defina para segunda a sexta-feira para um “chat com suporte agora” widget e deixe um “deixe-nos uma mensagem” bloco cobrir o fim de semana Combine o Dia da Semana com a Hora do Dia ligado Todas as condições atendidas e você descreveu o horário real de funcionamento em duas regras.
Cuidado com o relógio, no entanto. As condições de tempo são executadas em seu Fuso horário do site WordPress (Configurações > Geral), não do visitante Se a sua venda é suposto terminar à meia-noite para o cliente, e o seu servidor se senta em UTC enquanto os seus clientes estão em Nova Iorque, termina cinco horas mais cedo para eles Verificar essa configuração antes de agendar qualquer coisa que custe dinheiro.
Mostrar conteúdo por navegador ou sistema operacional
Escolha Navegador ou Sistema Operacional e segmente Chrome, Firefox, Safari, Edge, Windows, macOS, Linux e assim por diante.
O uso real para segmentação do SO é downloads de aplicativos Mostrar o botão Mac para visitantes do Mac e o botão Windows para visitantes do Windows, em vez de uma linha de quatro botões onde três deles estão errados para quem está procurando.
A segmentação por navegador é mais estreita do que as pessoas esperam É para o ocasional “este recurso se comporta de maneira diferente no aviso do Safari”, não para enviar designs diferentes por navegador Se uma seção só funciona no Chrome, corrija o CSS Não esconda dos seus visitantes do Firefox e ligue para ele.
Também vale a pena dizer claramente: isso não é segmentação de dispositivos Os controles responsivos da Elementor já ocultam elementos por tamanho de tela, e essa é a ferramenta certa para telefone versus desktop O sistema operacional é sobre a plataforma, não o tamanho da tela.
Onde isso se torna genuinamente útil
Algumas configurações que valem a pena roubar.
Execute dois cabeçalhos de um modelo: no seu Construtor Tema cabeçalho, coloque um botão “Log in” no status de login Não é0, e um “My Account” botão no Status de Login É. Um cabeçalho, ambos os públicos O mesmo truque funciona no rodapé.
Deixe as vendas funcionarem sozinhas com uma barra promocional em uma condição de intervalo de datas, agendada com semanas de antecedência, para que não haja confusão no dia de lançamento às 6h. Deixe as instruções do cliente na página com uma nota somente de administrador definida como função de usuário É Administrador, sentado exatamente onde é necessário em vez de enterrado em um e-mail.
Você também pode colocar condições nos elementos dentro a pop-up(portanto, um único pop-up atende visitantes logados e desconectados de maneira diferente e usa as condições do Taxonomy Archive para executar uma oferta diferente no arquivo de cada categoria de produto.
Para uma personalização mais profunda, emparelhe as condições com Tags Dinâmicas (ACF suportado) para que a versão que sobrevive às regras puxe dados ao vivo em vez de texto estático.
Coisas que apanham as pessoas
- Nenhum painel Condições de exibição. A extensão não está activada Master Addons > Configurações > Extensões.
- O elemento mostra a todos. A exibição está definida como “Qualquer condição atendida” quando você quis dizer “Todas as condições atendidas.”
- Funciona para você, mas não para visitantes. Você está logado como administrador Teste em uma janela privada, sempre.
- O conteúdo oculto aparece na fonte da página. O HTML de saída está ligado. Desligue-o.
- As regras do tempo disparam na hora errada. Fuso horário do site, não fuso horário do visitante. Configurações > Geral.
- As alterações não aparecem no site ao vivo. Um cache de página está servindo uma cópia armazenada A maioria dos plugins de cache não pode variar uma página em cache por usuário, portanto, o cache agressivo de página inteira e as condições baseadas em login funcionam umas contra as outras Exclua essas páginas do cache ou limpe-o e teste novamente.
Perguntas frequentes
O que é exibição condicional no Elementor?
A exibição condicional permite mostrar ou ocultar qualquer elemento do Elementor com base em regras, como se o visitante está conectado, sua função de usuário, seu navegador ou o dia da semana. Você constrói uma página contendo várias versões de uma seção e cada visitante vê apenas a versão que se aplica a eles.
Posso usar a exibição condicional no Elementor gratuitamente?
Sim. A extensão Condições de exibição vem com o plugin gratuito Master Addons. Ative-o em Master Addons, depois Configurações, depois Extensões e um painel Condições de exibição aparece na guia Avançado de cada elemento.
O conteúdo oculto está realmente escondido dos visitantes?
Com o HTML de saída desligado (o padrão), o elemento nunca é renderizado, portanto, não está na fonte da página de forma alguma Ative o HTML de saída e a marcação é carregada, mas está oculta com o CSS, que qualquer um pode desfazer nas ferramentas de manter desligado para qualquer coisa sensível.
Por que minha condição de exibição não está funcionando?
Normalmente uma de três coisas: o Display on dropdown é definido como “Qualquer condição met” em vez de “Todas as condições atendidas”, você está testando enquanto está logado como administrador ou um plugin de cache está servindo uma cópia armazenada da página Teste em uma janela privada com o cache limpo.
As condições baseadas no tempo usam o fuso horário do visitante?
Não. Eles são executados no fuso horário do seu site WordPress, definido em Configurações e depois em Geral. Se seus visitantes ficarem em um fuso horário diferente, uma venda que termina à meia-noite no seu servidor termina em um horário diferente para eles, então defina o fuso horário do site deliberadamente.
Embrulhando
A exibição condicional do elementor transforma uma página em quantas versões você precisar Ativar a extensão, abrir Advanced > Display Conditions em qualquer elemento e escrever a regra: verifique algo, Está ou Não, feito Duas configurações decidem se ele se comporta da maneira que você espera. Exibir em controles E versus OR, e Saída HTML controla se o conteúdo oculto está genuinamente ausente ou apenas pintado.
Faz parte do conjunto de extensões Master Addons grátis, então não há nada para comprar antes de experimentar Se você acabar querendo o resto do kit de ferramentas mais tarde, é isso que o Planos PRO são para.
Leitura relacionada: Animações de entrada do elementor, como criar um cabeçalho pegajoso no Elementor, e como adicionar verificação de idade no Elementor.
