Destaque do produto Divi: Divi Supreme Pro

Publicados: 2024-06-03

Divi Supreme Pro é um plugin robusto de terceiros desenvolvido pela Divi Supreme que expande os recursos dos sites Divi. Com mais de 60 módulos premium e oito extensões, oferece um conjunto abrangente de ferramentas para simplificar a construção de sites sem conhecimento de codificação.

Uma captura de tela da listagem do Divi Supreme Pro no Divi Marketplace

Com a confiança de muitos usuários Divi, esta solução econômica oferece código limpo, animações impressionantes e controle de design avançado. Neste destaque, abordaremos o plugin, seus recursos e muito mais. Vamos começar!

Índice
  • 1 O que você ganha com Divi Supreme Pro
    • 1.1 Mais de 60 módulos Divi extras
    • 1.2 8 Extensões Divi
    • 1.3 Mais de 40 layouts Divi premium
  • 2 Instalando o Divi Supreme Pro
  • 3 Usando Divi Supreme Pro
    • 3.1 Adicionando um Módulo
    • 3.2 Usando o Easy Theme Builder para cabeçalho
    • 3.3 Adicionando um texto com efeito de digitação
    • 3.4 Adicionando uma lista de preços
    • 3.5 Adicionando um efeito de texto de falha
    • 3.6 Adicionando um ponto de acesso de imagem
    • 3.7 Adicionando um título duplo
  • 4 Compre o Divi Supreme Pro
  • 5 Divi Supreme Pro: considerações finais

O que você ganha com Divi Supreme Pro

O Divi Supreme Pro impressiona com sua ampla gama de recursos, elevando seu site Divi a novos patamares. Vamos mergulhar em alguns dos recursos notáveis ​​que este plugin poderoso oferece.

Mais de 60 módulos Divi extras

Vamos começar examinando alguns dos módulos extras que são adicionados ao Divi depois de instalar o Divi Supreme Pro.

Divi Supremo Pro

Efeito de digitação

O efeito Digitar texto dá vida ao seu texto, fazendo com que pareça que ele está sendo digitado, uma letra por vez. Com o Divi Supreme Pro, você pode ajustar a velocidade de digitação e os efeitos de retrocesso. Você também pode definir atrasos antes de iniciar uma nova frase. Com apenas alguns cliques, você pode repetir a animação indefinidamente ou randomizar a sequência de frases.

Flipbox

Um flipbox é um recurso divertido da web que gira para mostrar mais detalhes quando você passa o mouse ou clica nele. É excelente para tornar as experiências do usuário mais envolventes e apresentar informações de forma sucinta. Com mais de 15 efeitos disponíveis, o Divi Supreme Pro permite criar conteúdo interativo atraente que atrai os usuários.

Botão Supremo

Divi oferece uma ampla gama de opções de personalização para os botões do seu site, mas às vezes você pode precisar de ainda mais controle sobre sua aparência, animações e funcionalidade. É aí que entra o módulo Supreme Button do Divi Supreme Pro. Com esta ferramenta, você pode criar botões com texto separador entre eles, escolher entre 29 animações de foco de botão diferentes e 15 efeitos de foco de ícone e adicionar uma lightbox de imagem ou vídeo que funciona com o YouTube, Vimeo e Dailymotion. Você também pode incluir dicas de ferramentas para ambos os botões.

Além disso, ele suporta vários tipos de links de URL, facilitando o link para URLs, e-mails, números de telefone, SMS, Facebook Messenger, Skype, WhatsApp e Telegram.

Emblemas de texto

Os emblemas de texto são pequenos rótulos coloridos usados ​​em web design para destacar informações ou status importantes, como notificações, novos recursos ou funções do usuário. Eles melhoram a experiência do usuário e a hierarquia visual. Usando o Divi Supreme Pro, você pode adicioná-los facilmente aos títulos e texto do seu site Divi.

Revelação de texto flutuante de imagem

Com este módulo, quando você passa o mouse sobre a imagem, uma sobreposição desliza da esquerda, cobrindo a imagem e mostrando o texto. Depois que você afasta o mouse, a sobreposição desliza para a direita, revelando a imagem novamente. Você também pode escolher entre diferentes animações para o texto que aparece. Este efeito exibe efetivamente muitas informações em um layout compacto.

Lista de preços

O Módulo de lista de preços da Divi Supreme Pro permite criar listas de produtos ou serviços visualmente atraentes e organizadas com seus respectivos preços. É ideal para menus, catálogos e listas de produtos, ajudando os clientes a encontrar e compreender facilmente as informações de preços.

Efeito de texto de falha

O efeito de texto de falha envolve distorcer intencionalmente o texto para criar uma aparência de falha digital. Ele adiciona um elemento visual único e dinâmico aos sites, dando-lhes um toque moderno e ousado. Com o Divi Supreme Pro, você pode adicionar facilmente o efeito de falha ao texto com apenas alguns cliques.

Embaralhar cartas

O Shuffle Letters Module para Divi aprimora seu site com um efeito de texto atraente. Digite o texto que deseja exibir e observe como ele percorre caracteres aleatórios antes de revelar a mensagem final. Você pode ajustar facilmente configurações como velocidade de reprodução aleatória, duração e texto aleatório com apenas alguns cliques.

Ponto de acesso de imagem

Um ponto de acesso de imagem é um ponto clicável em uma imagem que ativa uma ação ou mostra informações quando clicado. Com o Divi Supreme Pro, você pode criar pontos de acesso atraentes, responsivos e profissionais, mantendo a flexibilidade e personalização do Divi.

Título duplo

Obtenha uma tipografia impressionante aprimorando a aparência do texto do título com cores, fontes e outras personalizações. Você pode inserir texto antes, no meio e depois do título principal. Usando este módulo, você pode até destacar uma palavra específica, atribuindo-lhe uma fonte e uma cor exclusivas.

8 extensões Divi

Essas oito extensões fornecem todas as ferramentas que você precisa para criar sites excelentes sem esforço, aprimorando seu fluxo de trabalho e aumentando a funcionalidade do seu site.

Divi Supremo Pro

Pop-ups

Como o nome sugere, o Divi Popup ajuda a criar janelas pop-up que aparecem quando os usuários realizam ações específicas, como clicar em um botão ou link. Esses pop-ups podem mostrar conteúdo extra, coletar detalhes do usuário ou atender a qualquer outra necessidade adequada ao estilo de janela pop-up. Você pode personalizar os pop-ups para corresponder ao que funciona melhor para seus usuários.

Elemento agendado

O Divi Scheduled Element é um recurso adicional que permite agendar quando elementos específicos da página da web aparecem e desaparecem. Isso fornece um controle mais preciso sobre o tempo do conteúdo e pode ajudar a manter o envolvimento do usuário, revelando novos conteúdos em intervalos adequados. Este pode ser um método valioso para promover e automatizar descontos sem esperar o momento perfeito.

Visualizador responsivo

A extensão Divi Supreme Responsive Viewer torna mais fácil a criação de sites responsivos. Você pode visualizar e ajustar o design para telas de celulares, tablets e desktops sem precisar de ferramentas de inspeção do navegador. A interface é amigável, permitindo organizar o conteúdo sem esforço.

Construtor de tema fácil para cabeçalho

O Easy Theme Builder do Divi Supreme melhora as opções do poderoso Divi Theme Builder para WordPress para personalizar cabeçalhos. Ao rolar, você pode facilmente criar cabeçalhos fixos, diminuir a altura do cabeçalho e ver designs em vários dispositivos móveis.

Widget da Biblioteca

A extensão do widget Divi Supreme Library aprimora os recursos padrão do módulo Biblioteca do tema Divi. Com este módulo, você pode exibir postagens, páginas, produtos WooCommerce ou tipos de postagens personalizadas em vários layouts personalizáveis. Uma ampla gama de opções de design e layout permite criar exibições atraentes sem esforço, sem exigir habilidades de codificação.

Código curto da biblioteca

Com a extensão Divi Supreme Library Shortcode, você pode criar códigos de acesso para os itens de sua biblioteca, possibilitando incluí-los em qualquer postagem ou página usando a API de shortcode do WordPress. Você pode personalizar a aparência do shortcode, facilitando a criação de apresentações exclusivas e atraentes para os itens da sua biblioteca em qualquer página ou postagem.

Atributos personalizados

Com a extensão Custom Attributes, você pode incluir convenientemente atributos HTML personalizados em diferentes elementos no Divi Builder, como seções, linhas, colunas, módulos e botões. Esses atributos ajudam a adicionar dados que as bibliotecas JavaScript precisam ou atributos HTML padrão que o Divi Builder normalmente não inclui.

consulte Mais informação

A extensão Supreme Read More para Divi aprimora a experiência do usuário do seu site. Ele permite ocultar textos longos e revelá-los com um único clique, mantendo seu conteúdo conciso, mas informativo. Esta ferramenta é ideal para usuários Divi que desejam oferecer informações ampliadas sem sobrecarregar suas páginas.

Mais de 40 layouts Divi premium

Divi Supreme oferece mais de 44 layouts gratuitos disponíveis para download em seu site. Vamos explorar algumas das adições mais recentes:

Página inicial do e-book

Uma captura de tela do layout do e-book do Divi Supreme Pro

O template da Landing Page do E-Book é organizado e bem estruturado, separando benefícios e funcionalidades. Os marcadores ajudam os usuários a compreender rapidamente os detalhes essenciais. Vários botões “Saiba mais” e “Baixar e-book” incentivam o envolvimento. As áreas de conteúdo editáveis ​​permitem fácil personalização e o design permanece consistente. Este design tem o potencial de aumentar as conversões, fornecendo recursos avançados e opções de personalização, proporcionando uma experiência totalmente envolvente.

Página inicial de saúde mental

Uma captura de tela do layout de saúde mental do Divi Supreme Pro

O layout da página inicial de saúde mental enfatiza a saúde mental com um layout claro e estruturado. Inclui opções de aconselhamento práticas e acessíveis, destaca perfis de conselheiros e apresenta histórias de sucesso. O design limpo e moderno incorpora um esquema de cores suaves que simplifica a navegação e ajuda você a encontrar as informações que precisa. Os módulos Divi Supreme Pro melhoram sua experiência com recursos interativos, como efeitos de foco, filtros de imagem e ícones exclusivos.

Página inicial da planta

Uma captura de tela do layout da planta do Divi Supreme Pro

O layout da página inicial da planta é limpo e bem organizado, com bastante espaço em branco para facilitar a leitura. Ele destaca uma frase de chamariz forte, mantém uma tipografia consistente e equilibra bem as seções. O layout fácil de usar garante uma navegação intuitiva e faz com que os elementos-chave se destaquem de maneira eficaz.

Página inicial de consultoria

Uma captura de tela do layout de consultoria do Divi Supreme Pro

O modelo de Landing Page de Consultoria da Divi Supreme apresenta um layout moderno e clean que chama a atenção. As seções claras facilitam a movimentação e a compreensão. Tipografia ousada e imagens bem posicionadas chamam sua atenção e enfatizam informações importantes. Além disso, parece ter sido projetado para se adaptar a vários dispositivos, para que você sempre tenha uma ótima experiência de visualização.

Página inicial do restaurante

Uma captura de tela do layout do restaurante do Divi Supreme Pro

Este modelo de landing page de restaurante da Divi Supreme tem vários aspectos positivos em relação ao layout. Em primeiro lugar, o design é visualmente apelativo e moderno, com uma estrutura limpa e organizada. O uso de espaços em branco permite que o conteúdo respire e melhora a legibilidade. O menu de navegação é facilmente acessível, proporcionando uma navegação tranquila em todo o site. O uso de imagens atraentes e seções bem desenhadas ajuda a apresentar o cardápio e os serviços do restaurante de forma eficaz.

Instalando o Divi Supreme Pro

Instalar o Divi Supreme Pro é o mesmo que instalar qualquer plugin do WordPress. Depois de comprar o plug-in, baixe-o, vá até a guia Plug-in no painel do WordPress e selecione Adicionar novo plug-in.

Uma captura de tela de como instalar um plugin

Em seguida, clique no botão Carregar plug-in. Clique em Escolher arquivo para encontrar o arquivo zip do plugin em seu computador. Depois de localizar o arquivo, faça upload dele.

Uma captura de tela de como fazer upload e instalar o plugin

Depois de carregado, clique em Instalar agora para instalar o plugin. Por fim, ative-o clicando no botão Ativar Plugin.

Uma captura de tela de como ativar o plugin

Usando Divi Supreme Pro

Depois de instalar o plugin, você verá uma nova opção chamada Divi Supreme Pro na barra lateral. Clicar neste item de menu irá direcioná-lo para as configurações do Divi Supreme Pro. Aproveitar todo o potencial do Divi Supreme Pro é muito fácil, graças à sua interface intuitiva e integração perfeita com o Divi. Além disso, à direita da tela, você encontrará cartões úteis com links para documentação e opções de suporte. Então, se você está preso em algum lugar, a ajuda não está tão longe! Agora, vamos dar uma breve visão geral de seu layout e configurações:

Uma captura de tela das CONFIGURAÇÕES do Divi Supreme Pro

Configurações Gerais

Você abrirá automaticamente a guia de configurações gerais ao clicar no item de menu. É aqui que você pode ativar e gerenciar extensões Divi extras, como Divi Popups e o recurso Leia mais. Essas extensões estão desativadas por padrão.

Configurações do módulo

O plugin inclui vários módulos e recursos extras, que podem afetar ligeiramente o desempenho do seu site. No entanto, você pode manter seu site e editor simplificados usando a guia de configurações do módulo para desativar quaisquer elementos desnecessários.

Construtor de temas fácil

A guia Easy Theme Builder permite fazer alterações e adicionar dicas de experiência do usuário que discutimos anteriormente. Discutiremos essa guia em detalhes posteriormente nesta postagem.

Configurações de mídia social

Esta guia permite colar chaves de API e ativar configurações para módulos relacionados ao Facebook, como comentários do Facebook, botões, comentários e feeds ao vivo.

Diversos

Na guia Diversos, você encontrará várias configurações e opções que podem não ser cruciais, mas que às vezes podem ser úteis. Isso inclui configurações de compatibilidade, opções de desinstalação e recursos de segurança. Você também pode personalizar o nome e o ícone do plugin, um processo chamado white labeling, para apresentar uma imagem mais profissional aos seus clientes.

Adicionando um Módulo

Todos os módulos Divi Supreme Pro dentro do editor Divi são codificados por cores com uma cor púrpura brilhante para que você possa diferenciá-los e usá-los rapidamente. Além disso, todos eles têm o prefixo ‘Supremo’.

Uma captura de tela dos módulos do Divi Supreme Pro

Usando o Easy Theme Builder para cabeçalho

O Easy Theme Builder permite configurar seu cabeçalho, ajustar as cores do cabeçalho ao rolar e ajustar os elementos reduzidos de acordo com sua preferência. Normalmente, um cabeçalho com o Theme Builder rola junto com o site. No entanto, com as configurações de cabeçalho do Easy Theme Builder, você pode facilmente manter o cabeçalho fixo na parte superior. Você ainda tem opções adicionais, como desligar o recurso em celulares/tablets e algumas opções estéticas.

Uma captura de tela das opções de cabeçalho fixo do Theme Builder Header

Ativar a extensão de rolagem dá mais profundidade ao cabeçalho. Você pode alterar as cores de fundo e adicionar uma sombra de caixa que aparece quando você rola.

Uma captura de tela das opções de rolagem do Theme Builder Header

Por último, a opção Reduzir permite ajustar o tamanho do menu durante a rolagem e mudar o logotipo para uma imagem diferente. Adicione preenchimento a seções, linhas e módulos e defina uma porcentagem para a imagem diminuir.

Uma captura de tela das opções de redução do cabeçalho do Theme Builder

Adicionando um texto com efeito de digitação

Encontre Supreme Typing, selecione-o e adicione o módulo à sua tela.

Uma captura de tela do Supreme Typing no pop-up de módulos

Você verá opções para ajustar o efeito, com três campos de texto denominados Antes, Digitação e Depois. Os rótulos são diretos. O texto nos campos Antes e Depois será estático e não terá efeito de digitação. No campo Digitação de texto, você pode usar o símbolo de barra vertical (|) para adicionar vários textos que aparecerão um após o outro. Por exemplo:

Uma captura de tela das opções de digitação suprema

Você também tem configurações como exibição de textos em linhas separadas, opções de loop, velocidades, animações e opções de link abaixo do menu suspenso de texto de digitação inicial. Na seção de design, você pode personalizar cores, fontes e outras configurações de aparência deste módulo.

Adicionando uma lista de preços

Para adicionar uma lista de preços à sua página, primeiro encontre e adicione o módulo Lista de preços. Um pop-up aparecerá imediatamente. A opção inicial que você verá é um grande botão + para adicionar itens à lista de preços.

Uma captura de tela do módulo de lista de preços do Divi Supreme Pro

Clique nesse botão para abrir outro pop-up para inserir um novo item e seu preço.

Uma captura de tela das configurações do módulo de lista de preços do Divi Supreme Pro

Além disso, você pode incluir uma imagem para este item usando o menu suspenso que aparece a seguir. Isso é especialmente útil para empresas como restaurantes ou salões de beleza.

Uma captura de tela das opções de imagem da lista de preços do Divi Supreme Pro

Adicionando um efeito de texto de falha

Procure o Glitch Text Module e adicione-o à tela. Depois que o módulo for adicionado à tela, você poderá inserir o texto ao qual deseja aplicar o efeito trippy na caixa Glitch Text.

Uma captura de tela do Glitch Text do Divi Supreme Pro

Você tem três efeitos de falha para escolher no menu suspenso abaixo. Você também pode escolher cores para os efeitos de falha nos estilos Glitch Dois e Três.

Uma captura de tela dos efeitos de texto Glitch do Divi Supreme Pro

Experimente os vários estilos e opções de cores para obter a aparência desejada para o seu texto.

Adicionando um ponto de acesso de imagem

Para adicionar o módulo hotspot de imagem, procure “Supreme Image Hotspot” e clique para adicioná-lo.

Uma captura de tela do Supreme Image Hotspot no pop-up de módulos

Depois de adicionar o módulo, vá até o menu suspenso de imagens e escolha a imagem desejada. Na parte superior do menu suspenso da imagem, você encontrará um espaço para adicionar seus pontos de acesso. Clique no botão grande Adicionar novo (+) para abrir uma nova guia. Aqui, você pode escolher como seus pontos de acesso serão exibidos. Eles podem ser um ícone, uma imagem ou texto simples, selecionáveis ​​no menu suspenso ‘Tipo’.

Uma captura de tela da opção do Supreme Image Hotspot para adicionar pontos de acesso

Se estiver usando um ícone ou imagem para um ponto de acesso, você pode adicionar texto no menu suspenso 'Dica' abaixo da guia do ponto de acesso. Você pode até usar HTML na dica de ferramenta.

Uma captura de tela da opção do Supreme Image Hotspot para adicionar texto de ponto de acesso

Vá para a seção de design para ajustar a posição e as cores da dica de ferramenta. Quando estiver satisfeito com suas configurações, clique na guia Salvar alterações. Você retornará à guia inicial, onde poderá adicionar mais pontos de acesso e fazer alterações.

Adicionando um título duplo

Para adicionar um título duplo à sua página, localize e adicione o módulo Título duplo. Você tem três opções: Antes, Meio e Depois. Tecnicamente, permitem criar títulos com até três cores.

Uma captura de tela das configurações de título duplo do Divi Supreme Pro

Para ajustar as cores do texto, vá para a guia design. Lá, você pode controlar facilmente as cores, fontes e tamanhos do seu texto.

Uma captura de tela das configurações de texto de título duplo do Divi Supreme Pro

Compre Divi Supreme Pro

Divi Supreme Pro custa US$ 79 e está disponível no Divi Marketplace. Ele vem com uma garantia de devolução do dinheiro em 30 dias, para que você possa obter um reembolso se não estiver satisfeito com ele. Além disso, você pode usar o plugin em quantos sites desejar e receber um ano de suporte e atualizações.

Uma captura de tela da listagem do Divi Supreme Pro no Divi Marketplace

Compre Divi Supreme Pro

Divi Supreme Pro: considerações finais

Quer você seja um desenvolvedor ou designer, o Divi Supreme Pro agiliza o processo de criação, permitindo que você crie lindos sites personalizados sem esforço. Embora independente do Divi, este poderoso plugin visa aprimorar sua experiência de web design e pode ser um ótimo complemento ao seu kit de ferramentas Divi.

Adoraríamos ouvir sua opinião. Você usou o Divi Supreme Pro? Por favor, compartilhe sua experiência conosco nos comentários abaixo.