Ad - Web Hosting from SiteGround - Crafted for easy site management. Click to learn more.
WP Theme FAQs

Como criar Páginas usando Divi

Dec 7, 2022

Nesse tutorial, vamos falar sobre como criar Páginas no WordPress usando o Divi Builder.  Para tirar maior proveito desse tutorial, é importante que você já saiba como usar o WordPress e tenha lido ou assistido os Tutoriais #1 (Como instalar DIVI no WordPress) e #2 (Como Usar Divi no WordPress).  E se você ainda não está familiarizado com o WordPress, saiba que ele é a base do DIVI, ou seja, DIVI só funciona se instalado sob esse CMS (Content Management System). Um bom começo pode ser aqui, mas existem dezenas de tutoriais e eBooks na rede e qualquer dúvida, fale conosco.

Portanto, mãos à obra!

Criando Páginas

É possível criar conteúdo da forma tradicional, ou seja, sem usar o Divi mas sua criatividade estará limitada. Portanto, comece pressionando o botão “Use the Divi Builder” para abrir uma das 3 opções que são: Criar conteúdo a partir do zero, Importar um Layout da sua Biblioteca Divi (Divi Library) ou Clonar uma Página.

Criando conteúdo simples

Escolha a opção “Build from Scratch”, ou seja, criar conteúdo começando do Zero.

Escolha uma Coluna

Como explicado no Tutorial # 2, você pode escolher várias combinações de colunas.  Nesse exemplo, vamos usar apenas 1 coluna que cobrirá toda a área do seu texto. Futuramente vamos explorar as demais combinações que podem ser usadas com uma fileira de múltiplas colunas.

Escolha o Módulo de Texto

O módulo de texto inclui os mesmos recursos da tela clássica do WordPress à qual os usuários estão acostumados a usar, com a vantagem que ele  pode ser aplicado em mais de uma coluna dentro da mesma linha, como exemplificarei posteriormente.

Adicionar Texto

Siga esses passos para compor seu primeiro texto:
1) Clique no ícone “Gear” que vai abrir a tela de Configuração de Texto (Text Settings)
2) Escolha o estilo (tamanho) de fonte (Parágrafo, H1 a H6)
3) Ao terminar clique na aba verde para salvar o trabalho e publique

Pagina Simples

Como podemos ver, o resultado é muito simples, porque não adicionamos nenhum efeito visual, imagens, botões e tudo aquilo que faz do DIVI um solução ideal e prática para dar asas à nossa criação.  Mas nos exemplos seguintes, veremos o que é possível fazer para alcançar esse objetivo.

Página com Layout

Para criar uma página nova a partir de um layout,  use o mesmo exemplo do passo 3.1 acima. Dessa vez escolha a opção do meio (Choose a Premade Layout) para escolher um layout previamente importado para a biblioteca do seu site (Divi Library) ou escolha um download gratuito da Elegant Themes.

Tutorial Divi 3.2-2- Criando uma página

Escolher Layout

Neste exemplo, vamos escolher um layout previamente importado para o Divi Library.
O Layout tanto pode ser de uma página inteira ou apenas uma seção. Se o layout incluir imagens, as mesmas serão alocadas diretamente na sua Biblioteca de Imagens.

Tutorial Divi 3.9- Criando uma página

Demo via Wireframe

Em poucos segundos todo o layout da página estará pronto para ser revisado e editado. Aproxime o mouse para ver a página inteira no modo WireFrame. Textos, imagens, botões, etc. poderão ser editados diretamente nesta tela ou clique em “Build on the Front End” se preferir editar visualizando o resultado.

 

 

Tutorial Divi 3.10 Scrolling - Criando uma página

Demo via Front View

Esse é um Preview da página.

Como mencionado em 3.9 você pode editar o conteúdo diretamente por aqui, já que a visão frontal é mais fácil de trabalhar, mas é opcional. Aproxime o mouse para ver a página inteira no modo Front View.

Tutorial Divi 3.10 Scrolling - Criando uma página

Clonar uma Página

A terceira e última opção é para você que deseja clonar uma página já existente.  Para isso use o mesmo exemplo do passo 3.1 e dessa vez escolha a opção da direita (Clone Existing Page) nesta imagem.

Tutorial Divi 3.2-2- Criando uma página

Escolher a Página

Essa próxima tela abrirá mostrando as Páginas ou Posts já existentes no seu site.  Basta escolher qual você deseja clocar e o resultado na tela será semelhante ao dos  passos 3.9 e 3.10 acima. Depois disso é só editar o conteúdo.

Tutorial Divi 3.12- Criando uma página

No próximo tutorial vamos mostrar como editar cada bloco de texto, imagem e demais módulos para adaptar seu conteúdo ao layout ou como usar o layout importado como inspiração adaptando seu próprio estilo, cores e imagens.

Somos o Brasileirinho, seu portal de referência para serviços, eventos e produtos. Oferecemos criação e manutenção de websites, assistência em hospedagem e domínios, treinamento para criação de conteúdo e atualização de páginas e plugins. Trabalhamos exclusivamente com o WordPress, usando a plataforma DIVI para criar sites modernos e visualmente atraentes. Contate-nos e transforme suas ideias em uma presença online de sucesso!