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

Divi

Criador de sites grátis

O Divi é um poderoso criador de sites grátis para o WordPress com diversos recursos de edição e personalização de layout. Ele funciona, ao mesmo tempo, como um tema(theme) e também como um plugin, já que agrega diversas funcionalidades ao WordPress.

Diferencial

O seu grande diferencial é propiciar uma edição rápida e eficaz que pode ser realizada pelo visual do site. Dessa forma, não é necessário entrar no administrativo do WordPress toda vez que precisar alterar algo no conteúdo ou no layout. Por isso o Divi é o melhor criador de sites grátis do WordPress.

Vantagens

Outra grande vantagem é a gama de recursos que o Divi traz para o WordPress. Ele possui diversas opções de layout, e em cada layout, opções diferentes para a home, página de contato, landing page, loja virtual e outros. Milhares de temas prontos para serem utilizados.

O que é o Divi?

O melhor criador de sites do WordPress

O Divi vai além de um tema para WordPress qualquer, ele é um criador de sites grátis que substitui quase completamente o editor administrativo padrão do WordPress. Com isso, ele cria um ambiente de edição totalmente novo com recursos e funcionalidades que podem ser editadas visualmente.

O desenvolvedor do Divi foi a empresa Elegant Themes, famosa por construir um dos templates mais bonitos e funcionais do WordPress. Justamente foi o seu know how com o desenvolvimento de temas, que a levou a desenvolver esse sensacional construtor de sites.

Para muitos o Divi veio para revolucionar a forma como as pessoas enxergam e usam o WordPress. Isso se deve porque ele facilita a vida de todo desenvolvedor ou pessoa que pretende fazer o seu site e deixá-lo mais bonito. Por isso, grande parte das pessoas que conhecem o Divi não utilizam outra ferramenta para editar o seu site no WordPress.

A forma de edição e distribuição dos elementos de layout do Divi lembra muito a forma que se edita o site no Wix. Mas com uma grande vantagem, o Divi não possui limitações editoriais ou recursos que precisam ser pagos, como acontece no Wix.

Como criar um site visualmente

Editar o site visualmente significa fazer alterações e inserções diretamente na página, sem a necessidade de recorrer ao administrativo do WordPress, no caso. Então como eu consigo colocar uma imagem na página? É muito simples, basta criar um novo módulo de imagem, ou clicar no módulo existente para substituir  a imagem, simples assim.

Para inserir textos também funciona da mesma maneira, basta adicionar um módulo e pronto, o seu novo texto já está na sua página. Mas, se você quiser alterar o texto, é só selecionar o trecho e fazer a substituição com o famoso ctr+v.

Essas facilidades também são observadas na hora de  mover os módulos, que podem ser arrastados e organizados de acordo com a vontade do editor. mais adiante vamos explicar melhor como funciona toda essa organização dos módulos e também falaremos das linhas e seções.

Tema Divi: o template mais popular do WordPress

Por ser tão inovador e de fácil utilização, o Divi se tornou o template mais utilizado no mundo quando falamos de WordPress. Isso se deve, porque ele está cada vez mais popular. Ele é utilizado tanto por usuários comuns como também por empresas especializadas em desenvolvimento de sites.

O seu grande segredo é ser ao mesmo tempo simples e de fácil utilização e por outro lado é completo com diversos recursos que atendem às necessidades dos desenvolvedores mais experientes. Foi exatamente essa fórmula que tornou o Divi o criador de sites grátis de mais sucesso no WordPress.

Divi: Teste o criador de sites grátis

Isso mesmo, é possível testar o Divi e todas as suas funcionalidades no site CriarSite.online. Dessa forma você vai se familiarizar com essa incrível ferramenta antes de utilizá-la na criação do seu site.

Veja, in loco, todos os recursos funcionando, com isso você poderá perceber como é fácil atualizar o seu site apenas usando ferramentas visuais. Então não perca tempo e comece a testar o Divi gratuitamente.

Divi Builder: como funciona

O plugin do melhor criador de sites do WordPress

O Plugin Divi Builder habilita todo o sistema administrativo que vai tornar possível a edição visual do Divi. Ele funciona como o plugin e ficará instalado no mesmo local que os outros plugins do site.

Para fazer as modificações de configuração, é necessário ir até a aba Divi onde é possível clicar no item opções do tema. Ali são editáveis todas as possibilidades administrativas do Divi, desde a inserção da sua chave de licença até os links para as redes sociais. Mas toda essa interface é amigável, autoexplicativa e muito fácil de ser editada. 

A função central do Divi é ser um facilitador na hora de criar sites. Logo, para isso, ele traz algumas funcionalidades extras consigo. Vejamos agora algumas das principais para entendermos melhor como o construtor de site funciona.

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.

Iniciando com o Divi

Com o Divi instalado e ativo no seu site em WordPress, seu próximo passo ao criar uma página é escolher: entre utilizar umas das centenas de templates pré-prontos, criar uma página do zero ou clonar uma página existente.
Layout Divi

Seleção de temas

Se já tentou criar seu site em outras ocasiões, provavelmente, teve aquele momento de encarar uma tela em branco e realmente “dar branco”. Criar algo do nada é bem mais difícil do que editar e personalizar o que já existe. Então, para que você não tenha nenhum bloqueio criativo, vale a pena começar com um template pré-pronto.

E você não precisa se preocupar com falta de variedade. O Divi oferece centenas de layouts prontos para o usuário, cada um voltado para um contexto, seja um site institucional, um portfólio online ou uma loja virtual. Alguns são mais profissionais e sóbrios, enquanto outros são mais alegres e coloridos. Tudo depende da imagem que deseja construir.

Também é possível escolher temas específicos para lojas virtuais, segmentos de mercado como loja de veículos, produtos alimentícios, clínicas de saúde e estética entre outros.

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.

Divi: Interface Visual

Habilitando o Visual Builder

Agora chegou na hora de explicar como um clique pode fazer com que a página do seu site se torne completamente editável, como se fosse uma mágica.

Se você tiver logado no WordPress, verá na barra superior um link “Habilitar Visual Builder”, basta clicar e começar a editar a sua página.

Como se trata de um criador de sites grátis 100% visual é importante se atentar às cores dos elementos e como funciona cada um, mas isso vamos explicar mais adiante.

Editar utilizando o Visual Builder

O visual Builder, por sua vez, permite que você manipule o layout do site dentro da página diretamente, arrastando e soltando, alterando parâmetros e vendo os resultados imediatamente.

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.

Veja como funciona as seções:

As seções são representadas no Divi pela cor azul e são o principal elemento organizacional do Visual Builder. Elas são responsáveis por aglutinar linhas e módulos dentro dela, sendo considerada um elemento mãe. Na seção é possível definir a largura total dos elementos que nela serão inseridos, assim como as informações visuais como cor de fundo ou imagem de fundo.
A seção pode ser de três tipos: na forma regular que assume o seu papel padrão; na forma de especialidade, na qual assume um papel de layout específico de acordo com a necessidade de distribuição de elementos; e por último na forma de largura completa, ou como chamamos full width.

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.

As diversas opções de módulos:

Os módulos são os responsáveis por dar forma ao conteúdo que vai ser inserido. Por isso, há módulos das mais diversas modalidades, que vão desde um simples texto até um banner em slide. Isso permite que os conteúdos inseridos sejam arrastados e colocados nos lugares desejados. facilitando assim a organização e a edição do site.

É importante saber a função de cada módulo na hora de montar o seu site, já que são muitas opções e cada um determina uma função específica ou um formato de conteúdo. Por exemplo, o módulo de vídeo é destinado a inserção de vídeos seja por upload ou pela url. Já o módulo divisor cria uma linha para separar dois módulos diferentes e também é um elemento de layout.

Editor de papéis

Um dos recursos adicionais que o Divi trás é o editor de papéis. Função já realizada pelo administrativo do WordPress, mas que no Divi possui uma interface mais amigável e com maior facilidade de configuração.

Esse recurso permite definir papéis específicos na edição de conteúdo. Dessa forma, ele separa os papéis de administrador dos papéis de author, editor e outros. Isso permite que você tenha redatores freelancers produzindo conteúdo, mas que não tenham outras permissões administrativas do site.

Os papéis listados pela plataforma são:
  • administrador;
  • autor;
  • editor;
  • contribuinte;
  • assinante/seguidor.

Ainda, é possível atribuir cada uma dessas funções a um usuário manualmente ou mesmo personalizar tais permissões. Dessa forma, dois editores conseguem ser responsáveis por duas sessões diferentes no mesmo site.

Divi layouts : quais as opções de temas?

Como já mencionamos, o Divi em WordPress vem com várias opções de visuais prontos, que você pode manipular para criar uma página personalizada.
A melhor parte disso é que existem temas gratuitos para o Divi, não sendo necessária pagar por um template. Mas se quiser algo bem específico, pode buscar outros temas pagos ou mesmo contratar um web designer profissional para criar um site único.

Divi vs outras ferramentas: quais as vantagens?

Todas essas características ajudam a mostrar como o Divi é uma boa ferramenta para criar seu próprio site. Descubra o que destaca suas principais vantagens em relação a outras ferramentas.

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.

Suporte para CSS, HTML e Java Script

Algo que mencionamos, mas não explicamos bem, ainda, é a possibilidade de manipular o código fonte, que é um diferencial do Divi em relação a algumas alternativas.

Outras plataformas de criação de sites também oferecem opções que removem a necessidade do código na edição da página, mas isso, geralmente, retira um pouco de sua flexibilidade. Sem programar, alguns recursos mais complexos se perdem.

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.

Funcionalidades extras: como utilizar?

Pois bem, já conhecemos a maior parte dos recursos que o criador de sites grátis Divi oferece. Mas ainda há outras funcionalidades menores que podem facilitar sua vida. Vejamos algumas delas.

Reduzir e renomear sessões do texto

Essa é muito útil para quem trabalha com conteúdos longos. Em vez de ter que rolar toda a página sempre que for alterar algo, você pode criar blocos dentro do texto e reduzi-los depois que forem concluídos. Isso ajuda na sua navegação entre diferentes tópicos.

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.

Ancoragem alternativa

Um dos melhores recursos que você pode usar em um conteúdo longo é a ancoragem. Basicamente, funciona como capítulos em um livro digital, marcando diferentes pontos da página, os quais podem ser acessados rapidamente.

Normalmente, eles são feitos com um código vinculado ao texto, mas isso gera alguns problemas. O maior deles é que, ao clicar no índice, o título de destino quase sempre fica fora da tela.

A função de ancoragem alternativa ajuda a contornar um pouco isso, manipulando a posição da âncora visualmente. Dessa forma, você garante que o enquadramento fique certinho depois de clicar no atalho.

Tipos de licença: quais são as disponíveis no Divi?

Você considerou todos os aspectos que citamos e está pensando em licenciar o Divi para o WordPress? Ótimo! Seu próximo passo agora é conhecer as opções de licença que ele oferece. Felizmente, você não precisa pesquisar demais, pois há apenas duas e ambas oferecem o mesmo serviço.

Licença anual

Como a maioria dos plugins e ferramentas digitais, o Divi pode ser assinado com uma licença válida por um ano. Isso dará acesso a todas as funcionalidades da ferramenta, atualização durante 12 meses, suporte técnico premium, vários pacotes com temas prontos para criar seu site profissional, entre outras vantagens. Tudo isso com apenas um pagamento anual.

Licença vitalícia

Por outro lado, caso queira usar essa ferramenta por bastante tempo e economizar no longo prazo, pode pagar um pouco mais para adquirir a licença vitalícia. Você terá acesso aos mesmos recursos da licença anual, incluindo qualquer atualização, mas terá que pagar apenas uma vez. Para quem pretende manter a estrutura por vários anos, é um ótimo investimento.

Licença do Divi gratuita

Você deve estar se perguntando, será que é possível obter uma licença gratuita do Divi? Sim, é possível. A Link Nacional oferece gratuitamente a licença do Divi para todos os clientes que possuírem algum plano de hospedagem.

Agora que você já conhece o melhor criador de site grátis, que tal adquirir um plano de hospedagem para já poder começar a utilizar?

Basta clicar no botão abaixo e escolher o plano de hospedagem que mais atende às necessidades do seu negócio.

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

Posts relacionados

Editor visual de página WooCommerce com Divi

Editor visual de página WooCommerce com Divi

A Elegant Themes acaba de lançar novas funcionalidades para editar o Woocommerce pelo Divi Builder. São 16 novos módulos que prometem turbinar e aumentar as possibilidades de personalização da sua loja virtual. Agora é possível inserir uma série de recursos...

ler mais
Os 20 melhores temas gratuitos para o Divi

Os 20 melhores temas gratuitos para o Divi

Uma das melhores coisas sobre o Wordpress e Divi são os layouts gratuitos disponíveis na comunidade. Os layouts são fáceis de usar e oferecem um excelente local para começar, economizando muito tempo de design. Adicione seus próprios estilos e fotos, mova ou edite...

ler mais

Como inserir um vídeo do youtube no site com DIVI

Como inserir vídeos do Youtube no site com DiviO módulo de vídeo O Módulo de Vídeo é perfeito para adicionar um único vídeo em qualquer lugar do seu site em qualquer layout. Basta fazer o upload de um vídeo ou definir um URL de vídeo e o Divi irá inseri-lo em sua...

ler mais
WhatsApp chat