Conheça o Divi: o criador de sites grátis do WordPress

Sobreposição à interface do WordPress

Como já mencionamos, o menu e interface de edição do Divi substituem o formato padrão do WordPress, removendo boa parte da edição baseada em menus e manipulação de código. Essas opções ainda existem, claro, mas o método principal agora é o “drag & drop”, ou seja, pegar os elementos e arrastá-los e soltar pela página.

Com essas mudanças, é mais fácil encontrar certas opções, fazer alterações na página ou qualquer outra função. Dessa forma, fica bem mais fácil criar um blog, um e-commerce ou qualquer outro tipo de site.

Edição de página com interface visual

Como falamos anteriormente, a grande sacada do Divi é permitir que o proprietário do site possa editá-lo por meio de recursos visuais. Assim, é possível definir a disposição dos elementos do layout, textos e fotos.

A forma mais simples de explicar é dizer que o editor se trata de uma “colagem”. Normalmente, quando você cria um site, é necessário aplicar as mudanças no código da página e depois ver como elas ficaram. Isso deixa tudo mais lento e difícil de manejar, especialmente se você não entende o que o código significa.

Editar utilizando o Visual Builder

Para isso, ele oferece uma série de elementos, que fazem parte da organização do layout. Onde esses elementos chamadas de seções, linhas, e módulos cada um com uma hierarquia entre si e uma forma de construção própria. Por isso, é de vital importância entender bem como funciona cada elemento e suas funcionalidades.

Como funciona as linhas:

As linhas são representadas pela cor verde e a sua principal função é definir o número de colunas e a largura de cada uma na composição do layout. Todas as configurações de colunas serão feitas nos elementos de linha.

É possível inserir quantas linhas achar necessário dentro da seção. Dessa forma, cada linha pode ter um número diferente de colunas, já que uma é independente da outra.

As linhas podem ser configuradas para ter até 6 colunas e o tamanho das colunas pode ser ajustado de acordo com a necessidade do layout. Para mudar o número de colunas é necessário criar outra linha, já que cada linha possui um número específico de colunas.

Os papéis listados pela plataforma são:

• administrador;
• autor;
• editor;
• contribuinte;
• assinante/seguidor.

Divi vs outras ferramentas: quais as vantagens?

Manipulação do visual sem código

Trata-se do foco central desse recurso. Com ele, você pode fazer mudanças de qualidade profissional em uma página sem ter que recorrer ao código para cada um delas. Ótimo para profissionais liberais que não entendem de web design e para veteranos da área que desejam acelerar o próprio trabalho.

Edição em tempo real

Quando você edita algo no WordPress tradicional, precisa abrir uma página de teste para confirmar o formato. Porém, cada vez que faz isso, são mais 10 a 20 segundos de espera, os quais podem se acumular bem rápido. Sem falar que, caso haja falha, você não tem como ter certeza de qual parte do código está errada.

Com a manipulação intuitiva e em tempo real, você sabe imediatamente como cada elemento da página respondeu às suas alterações. Ainda, já sabe o que um site deve ter, isso poupará tempo e dor de cabeça.

Pense também na maior facilidade que você tem para confirmar quando uma determinada característica do seu site está ou não ao seu gosto. Mudou um ícone de lugar? Você confere o enquadramento na hora. Quer ver outro esquema de cor? O resultado sai em um segundo. Isso te permite comparar pequenas diferenças e ver aquela que te dá o melhor design para seu site.

Manipulação de elementos globais

Você certamente já viveu essa história: criou 5 páginas para seu site, mas resolveu mudar um elemento de design e teve que alterar tudo manualmente. Imagine ter que fazer isso quando tiver dúzias de postagens!

Felizmente, o Divi também permite que você marque elementos globais que serão repetidos em todas as páginas. Dessa forma, quando fizer uma alteração, seja de cor ou tamanho, ela será automaticamente replicada em todo o seu site.

Com o Divi, isso não é um problema, uma vez que tem suporte para mudanças no código fonte, assim como o WordPress, incluindo CSS, Java Script e HTML. Não há limitações sobre como essa ferramenta pode ser usada.

Criação de páginas responsivas

Ter sites responsivos é a norma hoje em dia, pois os clientes acessam seus conteúdos usando diferentes aparelhos, principalmente celulares e tablets. Uma página responsiva pode se adaptar melhor a esses formatos, proporcionando a melhor experiência de navegação possível.

E se você quiser ter certeza que o seu layout funciona perfeitamente em todas as plataformas ou fazer alguns ajustes mais específicos, é possível testar o seu design em todos os formatos. Você começa editando no formato de desktop, depois pode ver como ele ficaria em um tablet ou celular. Tudo isso enquanto edita o conteúdo.

Reduzir e renomear sessões do texto

Manipulação do visual sem código

Trata-se do foco central desse recurso. Com ele, você pode fazer mudanças de qualidade profissional em uma página sem ter que recorrer ao código para cada um delas. Ótimo para profissionais liberais que não entendem de web design e para veteranos da área que desejam acelerar o próprio trabalho.

Ocultar elementos na versão mobile

Ainda, oferece opções complementares de responsividade, caso algo ainda não se encaixe bem em outras versões do site. Um exemplo disso é a possibilidade de ocultar determinados elementos, como a logo, quando ele é visualizado em celulares. Isso economiza espaço na tela e a deixa mais leve.

Animação suspensa

Já notou como alguns menus e imagens em sites têm uma pequena animação quando você passa por eles, como uma barra que é preenchida ou uma dissolução? Tudo isso pode ser programado dentro da interface do Divi.

Primeiro, você escolhe qual objeto deseja manipular, por exemplo, o menu principal do site. Em seguida, determina o tipo de animação e um gatilho para realizá-la. Nesse caso, queremos que o menu do cabeçalho apareça gradualmente quando ele é carregado, então, selecionamos a opção “expand” na sessão “drop down menu animation”.

Depois disso, basta testar a página e ver como a animação funciona. Se ficar ao seu gosto, basta salvar as alterações.

Conclusão

Ficou impressionado com a gama de recursos que o Divi possui? Por isso que ele é o tema mais utilizado na plataforma WordPress. Além de ser fácil de usar, possui diversos recursos para editar o layout e o conteúdo do seu site.

Agora que você já sabe tudo sobre o Divi, que tal começar a fazer um site? Entre em contato com os consultores da Link Nacional e comece agora a colocar o seu negócio na internet.

E se quiser continuar se informando, inscreva-se no canal da Link Nacional no YouTube e confira nossos vídeos com dicas e tutoriais para tirar suas dúvidas.

Você pode testar os recursos do Divi no https://divi.criarsite.online