Divi Plugin Highlight - Divi Display Logic
Publicados: 2017-08-06E se você quisesse que um elemento de design Divi específico fosse exibido com base nas condições que você escolheu? Isso abriria algumas possibilidades de design, como exibir uma versão de uma página com base no status de login do usuário, a hora do dia ou sua geolocalização. Um plugin chamado Divi Display Logic dá ao Divi esse recurso.
Divi Display Logic é um plugin de terceiros da Tortoise IT que funciona com Divi e Extra para adicionar lógica de exibição. Neste destaque do plugin, daremos uma olhada no plugin e ver alguns exemplos do que ele pode fazer.
As imagens para esses exemplos foram tiradas de Unsplash.com e dos layouts Divi gratuitos disponíveis aqui no blog Elegant Themes.
Instalando Divi Display Logic

Faça upload e ative o plugin normalmente. Um novo item de menu é adicionado ao painel em plug-ins chamados Divi Display Logic. Aqui você adicionará sua chave de licença. Isso garantirá que você obtenha atualizações de plug-ins.

Display Logic agora é adicionado a todas as seções, linhas e módulos na guia Conteúdo no Divi Builder backend. Os recursos incluem uma seleção de data e hora, uma caixa suspensa onde você pode escolher a lógica predefinida e uma caixa que exibe o shortcode que o plugin cria para sua lógica.
Lógica Predefinida

A caixa suspensa Lógica predefinida tem 18 opções lógicas predefinidas para escolher. Existem mais alguns que você pode copiar e colar na área do shortcode. Você pode adicionar suas próprias escolhas lógicas se quiser codificar e pode manipular o shortcode para criar variações.
As opções são mostrar ou ocultar com base em um determinado horário, entre determinados horários, em dias específicos, mostrar se tem uma categoria NEWS, se o usuário está logado, para uma determinada função de usuário, para um determinado local, e com base em Código PHP. Todos eles podem ser modificados.
Logic Shortcode

Depois de escolher uma lógica predefinida, ele cria automaticamente um shortcode. Você não precisará usar este código de acesso, mas pode editá-lo aqui se desejar.
Você também pode usar qualquer shortcode de encapsulamento (um shortcode com uma tag de início e fim [shortcode] [/ shortcode]) para criar seus próprios argumentos. Isso é explicado na descrição no campo shortcode, mas gostaria de ver um exemplo fornecido na descrição também.

Para editar, basta destacar a parte dentro do código de acesso e fazer suas alterações.

Aqui está um exemplo que irá ocultar o conteúdo durante a semana. Se você quiser mostrar o conteúdo em vez de ocultar, altere “ocultar” para “mostrar” no código de acesso. Outra opção seria substituir os números de 1 a 5 por “6,7”, o que ocultará o conteúdo nos finais de semana.

Descobri que a manipulação do shortcode é intuitiva porque a maioria das palavras-chave na string são diretas.
Exemplos de shortcode integrados

O primeiro link (denominado Clique aqui) na área Exibir lógica fornece exemplos detalhados dos códigos de acesso. Eles são especialmente úteis para os exemplos de PHP. Você pode copiá-los e colá-los no campo do código de acesso.
Seleção de data e hora

Para usar a Seleção de Data / Hora, clique no texto “Se usar datas, clique aqui”. Isso abrirá dois campos onde você pode escolher as datas de exibição e ocultação. Estas são as condições de tempo que determinarão quando a seção, linha ou módulo será exibido. A lógica para a exibição será escolhida na lista Lógica predefinida.

Selecione a data e a hora clicando nos campos para Mostrar data e Ocultar data. Isso abre um calendário com controles deslizantes de hora e minuto. Acima dos campos está uma mensagem que mostra a hora do seu servidor atual.
É importante usar o horário do seu servidor em vez do horário real. É aqui que o WordPress obtém a hora atual e é a hora que o Divi Display Logic usará.

O módulo agora mostrará o conteúdo entre a data e a hora que eu escolhi.
Isso abre muitas possibilidades. Por exemplo:
- Você pode criar um site de vendas com negócios relâmpago usando um cronômetro de contagem regressiva para mostrar quando o negócio termina e o próximo começa.
- Você poderia ter uma venda para começar em um determinado momento.
- Faça um acordo para terminar em um determinado horário.
- Mostre o conteúdo de um artigo em um determinado momento, mesmo após a publicação do artigo.
- Mostrar conteúdo diferente com base na manhã ou na tarde
Exemplos de lógica de exibição Divi - Chamada para ação da escola
Para meu primeiro exemplo, estou criando uma página de destino para uma escola. A página terá uma chamada à ação de inscrição para estudantes nos Estados Unidos, mas ninguém fora dos Estados Unidos poderá se inscrever. Este exemplo usa o layout da página inicial para universidades e faculdades.

O layout inclui uma linha com módulos de texto e botão. Quero que o texto e o botão sejam substituídos por módulos diferentes para qualquer pessoa fora dos EUA.

Nas configurações de linha, escolhi “Ocultar o conteúdo se o usuário estiver nos EUA”.


Em seguida, alterei “ocultar” no código de acesso para “mostrar”, criando efetivamente um novo código de acesso.

Clonei a linha e selecionei ocultar o conteúdo para usuários nos EUA para a nova linha.

Agora, apenas uma das linhas será exibida com base na localização do visitante.

Os visitantes dos EUA veem o slogan original e o botão para aplicar.

Todos os visitantes de fora dos Estados Unidos veem um slogan e um botão diferentes com uma legenda diferente.
Exemplos de lógica de exibição Divi - Venda Flash

Esta é uma página de vendas simples que mostra apenas um produto como uma venda rápida. Quando o cronômetro chega a zero, um novo produto com um novo cronômetro toma o seu lugar.

Embora apenas uma seção seja exibida, a própria página saiu de algumas outras seções. Em cada seção, defini a lógica para mostrar o conteúdo em um momento específico. As seções não carregam quando a página é carregada no navegador, então você pode adicionar quantos quiser com todo o CSS que quiser e eles não retardarão o tempo de carregamento.
O cronômetro de contagem regressiva e a lógica do display funcionam independentemente um do outro. Eu configurei o tempo para o contador para coincidir com o tempo que o Display Logic irá mostrar.
Exemplos de lógica de exibição Divi - Site do autor com área de membros

Este exemplo usa o layout gratuito Elegant Authors. Desejo mostrar conteúdo diferente com base no fato de o visitante estar ou não conectado. Os visitantes que não estiverem logados verão a tela na imagem acima, que inclui uma frase de chamariz.
Os visitantes que estiverem logados não verão um CTA. Em vez disso, eles verão um link para uma área especial do site à qual apenas aqueles que estiverem logados terão acesso. O acesso especial pode ser controlado por plug-ins de associação separados ou atribuindo um recurso de usuário para visualizar o conteúdo e escolhendo esse recurso como a lógica.

Em vez de clonar a seção inteira, apenas clonei o botão. Tudo o resto permanecerá o mesmo. Desta forma, se eu decidir mudar a imagem de fundo, só preciso mudá-la em uma seção.

Eu defino a lógica do botão superior para mostrar o conteúdo apenas para usuários desconectados.

O segundo botão será mostrado apenas para usuários logados.
Como alternativa, eu poderia ter usado 'MOSTRAR este conteúdo se o usuário tiver o recurso “view_content”.'

Os usuários conectados agora veem o novo botão que fornece um link para uma página ou postagem específica.
Exemplos de lógica de exibição Divi - Site do autor com nova página inicial

Claro que outra possibilidade é mostrar uma página completamente diferente. Este exemplo usa o mesmo layout do exemplo anterior, mas adicionei duas novas seções que incluem um cabeçalho de largura total e um módulo de blog.
Eu defini a lógica para cada seção. Todas as seções que compõem a página de aterrissagem serão mostradas aos usuários que não estão logados. As duas seções inferiores, que criam uma página de blog com cabeçalho de largura total, serão exibidas para usuários que estão logados.

Agora, os usuários conectados não verão a página de vendas. Se eu alterar o item de venda para algo que desejo que todos os usuários vejam, simplesmente altero a lógica de exibição.
Usando Divi Display Logic com Extra

Divi Display Logic também funciona com Extra. Este exemplo mostra o Módulo Carrossel de Postagens no Construtor de Categoria.
Licença
O Divi Display Logic pode ser usado em sites ilimitados para você e seus clientes. Inclui 6 meses de suporte e 12 meses de atualizações. Após o término dos 12 meses, você precisará comprar novamente o plug-in para receber as atualizações. O preço de recompra é 50% do preço de compra inicial.
Pensamentos finais
Divi Display Logic oferece muitas opções para determinar quando uma seção, linha ou módulo será exibido. Com opções de exibição que incluem hora, data, geolocalização, se o usuário está ou não conectado e o nível do usuário, as possibilidades de design são praticamente infinitas.
Achei o plug-in intuitivo de usar. Os códigos de acesso são fáceis de manipular. Mais alguns exemplos seriam úteis - especialmente para PHP. Se você deseja exibir uma seção, linha ou módulo com base em uma condição, o Divi Display Logic é uma ótima escolha.
Consulte Divi Display Logic na Tortoise IT para obter informações sobre compras.
Nós queremos ouvir de você. Você usou o Divi Display Logic? Deixe-nos saber o que você pensa sobre isso nos comentários.
Imagem em destaque via phipatbig / shutterstock.com
