Como criar um tema Divi Child

Existem milhares (isso mesmo, milhares!) de temas WordPress disponíveis para você escolher na hora de construir um site. A maioria dos web designers, entretanto, descobre que, embora os temas do WordPress sejam um bom ponto de partida, eles desejam mais personalização, e criar um tema filho é uma ótima maneira de fazer isso.

Os temas filhos são baseados em temas pais e permitem adicionar ou remover seu próprio código. Se você deseja realmente personalizar seu site WordPress, usar temas filhos é a melhor opção e Divi é uma das melhores escolhas.

O maior motivo pelo qual os criativos criam um tema filho Divi é para que, quando o tema pai for atualizado, nada seja interrompido em seu site. Criar um tema filho do Divi atua essencialmente como uma rede de segurança, sempre disponível para capturar seu site antes que ele quebre! Mas estou me adiantando, então vamos começar com o básico.

Neste artigo, abordarei:

• O que é Divi e quais são os recursos?
• Como criar um tema infantil Divi (+ um download infantil gratuito!)
• Como testar se o seu tema filho Divi está funcionando

Vamos mergulhar.

O que é Divi e quais são os recursos?

Divi é um tema WordPress da Elegant Themes que permite construir suas páginas usando diferentes elementos estruturais desde o início. Isso significa que você tem controle total sobre tudo nos sites que está construindo devido ao seu editor visual superior.

Ele também vem com centenas de designs pré-fabricados, então se você não tem experiência em criar e personalizar temas, não se preocupe! Quer você seja um iniciante em busca de personalizar seu primeiro site ou um desenvolvedor experiente, o Divi oferece as ferramentas para dar vida às suas ideias.

Divi tem duas interfaces de construtor: o editor visual no front-end do WordPress e o construtor back-end. No editor visual, torna a construção de sites para clientes 10 vezes mais fácil, rápida e agradável porque você pode editar na própria página e ver suas edições ao vivo. No back-end, você está editando a representação baseada em blocos dentro da postagem. No entanto, você ainda pode adicionar novos módulos e fazer essencialmente tudo como faria no editor visual. Também é fácil alternar entre os editores, dependendo da sua preferência.

Divi também possui três elementos estruturais principais que você pode utilizar como estão ou personalizar de acordo com suas especificações exatas: seções, linhas e módulos.

Seções: Estes são os maiores blocos de construção do construtor Divi. Você pode considerá-los como blocos de empilhamento horizontal que podem agrupar seu conteúdo em áreas visualmente distinguíveis. Tudo que você constrói começa com uma seção.

Linhas: Linhas são os vários layouts de colunas que podem ser colocados dentro das seções. Eles possuem várias configurações que podem ser acessadas clicando no ícone de configurações no canto superior esquerdo da linha e podem ser usados ​​para aumentar significativamente a variedade de layouts construídos com o Divi Builder, uma vez que criam a estrutura em que seus módulos estão alojados.

Módulos: Os módulos contêm diferentes elementos de conteúdo, como imagens, conteúdo, controles deslizantes, galerias, formulários de contato, CTAs, blogs, formulários, depoimentos, etc. São mais de 40 módulos que você pode escolher e personalizar como desejar.

Agora que você entende o Divi um pouco melhor, vamos nos aprofundar em como criar um tema filho.

Como criar um tema Divi Child

Antes de começar a personalizar as coisas, certifique-se de ter o Divi instalado e ativado. Existem duas maneiras de fazer isso:

Opção 1: Use Flywheel + Divi para instalação rápida e fácil.

Opção 2: O método manual (siga estas duas etapas)

Passo 1: Cadastre-se e baixe o Divi aqui. Depois de criar uma conta e fazer login, você será redirecionado para a área de membros e irá para o lado esquerdo e encontrará a guia “Downloads”. Encontre Divi e clique em “Baixar”. Isso envia um download do Divi em um arquivo zip para a pasta Downloads.

Passo 2: É hora de fazer login no seu site WordPress. Vá para Aparência > Temas. Clique em Adicionar novo ou Adicionar novo tema no lado direito. Clique no botão “Carregar tema” no canto superior esquerdo. Escolha o arquivo e encontre o arquivo zip Divi. Observação: mantenha-o em um arquivo zip (não descompacte). Clique em Instalar. Após terminar a instalação, clique em “Ativar” e ele estará instalado e ativado em seu site! ?

Agora você está pronto para criar um tema infantil Divi! Existem três maneiras principais de criar um tema filho Divi: baixar um tema filho gratuito, usar um plugin ou codificá-lo manualmente.

Opção 1: Baixe um arquivo de tema Divi Child gratuito

Uma das maneiras mais rápidas (e fáceis!) De criar um tema infantil é baixar este tema infantil Divi gratuito. Tem tudo o que você precisa para começar, além de espaço para personalizar ao seu gosto! Baixe seu tema infantil Divi gratuito abaixo.

Depois de baixado, instale o Divi, ative-o e pronto! É tão fácil quanto isso. Se preferir uma maneira diferente de criar um tema filho Divi, você pode tentar um plugin.

Opção 2: crie um tema Divi Child usando um plug-in

Existem vários plug-ins disponíveis para ajudá-lo a criar um tema filho Divi. Aqui estão alguns dos meus favoritos:

• Crianças Divi
• Configurador de tema infantil
• Criador de tema infantil por Orbisius

Crianças Divi

Divi Children é um plugin gratuito desenvolvido especificamente para usuários do Divi. Ele faz automaticamente o trabalho pesado para você, para que você possa se concentrar apenas no lado criativo! Cada tema infantil criado por Divi Children vem com muitos recursos de personalização por meio do WP Customizer. Aprenda como instalar este plugin aqui.

Configurador de tema infantil

Este plugin foi projetado para usuários do WordPress que desejam personalizar diretamente as folhas de estilo do tema filho. Com este plugin, você pode identificar e substituir facilmente os atributos CSS exatos que deseja personalizar e o analisador verifica o tema renderizado e configura automaticamente seu tema filho. Saiba mais sobre este plugin e como instalá-lo aqui.

Criador de tema infantil por Orbisius

Este plugin permite que você crie rapidamente temas filhos a partir de qualquer tema que você tenha instalado atualmente em seu site. Com este plugin, você pode criar um número ilimitado de temas filhos a partir do seu tema pai, então as opções são infinitas. Possui dois editores e você pode escolher trechos de um tema e colá-los em outro. Fale sobre personalização! Saiba mais sobre como instalar este plugin aqui.

Finalmente, se um plugin não for para você, sempre há a opção de criar um tema filho Divi manualmente!

Opção 3: criar um tema Divi Child manualmente

Se você é um desenvolvedor WordPress ou simplesmente adora um bom desafio, esta é uma ótima maneira de criar um tema filho Divi.

Etapa 1: crie o arquivo style.CSS

Como você provavelmente sabe, o arquivo style.css serve para informar ao WordPress os detalhes do seu tema filho e pode ser usado para adicionar CSS personalizado! Para fazer isso, crie uma pasta em seu computador e dê um nome a ela (algo que permite saber que se trata de um tema filho Divi). A partir daí, crie um arquivo nessa pasta e nomeie-o como style.css.

Nota: Certifique-se de ter uma ferramenta de edição de texto ou código, caso contrário, será difícil nomear esse arquivo!

Etapa 2: adicione isto ao arquivo style.css:

 /*
 Nome do tema: Tema Divi Child
 URI do tema: https://www.elegantthemes.com/gallery/divi/
 Descrição: Tema infantil para Divi
 Autor: Seu Nome
 URI do autor: https://getflywheel.com/
 Modelo: Divi
 Versão: 1.0.0
*/

O nome do tema, o URI do tema, a descrição, o autor, o URI do autor e a versão são todos editáveis. Mantenha o nome do modelo como está! Para obter mais personalização (e para garantir que seu tema filho Divi esteja funcionando), adicione qualquer CSS personalizado aqui.

Etapa 3: crie o arquivo funções.php

Crie outro arquivo na pasta que você já criou e nomeie-o como functions.php

Em seguida, adicione este código ao seu novo arquivo e adicione quaisquer funções personalizadas que desejar abaixo da última linha:

 <?php
função divi__child_theme_enqueue_styles() {
    wp_enqueue_style( 'estilo pai', get_template_directory_uri() . '/style.css' );
}
add_action('wp_enqueue_scripts', 'divi__child_theme_enqueue_styles');

Etapa 4: crie uma captura de tela

Este é um passo importante para que seu site não tenha um espaço em branco onde a imagem deveria estar na página de temas do WordPress, então tirar uma captura de tela rápida é um passo fundamental aqui! Depois de tirar a captura de tela, vá em frente e certifique-se de que as dimensões sejam 880x660px, que seja um .png ou .jpeg (qualquer um funciona!) e que o nome seja [screenshot.png] ou [screenshot.jpeg]. Em seguida, você adicionará sua imagem de captura de tela à pasta principal.

Etapa 5: compactar a pasta e fazer upload

Por fim, compacte a pasta em um arquivo zip e carregue-a no WordPress! Você irá para Aparência > Temas > Upload e clicará em Ativar.

Voilá! Você criou com sucesso um tema infantil Divi e está pronto para personalizá-lo de acordo com seu desejo.

Como testar se o seu tema Divi Child está funcionando

Para testar se o seu tema filho está funcionando corretamente, adicione um pouco de CSS no arquivo style.css do tema filho e salve as alterações. Você deverá ver essas alterações no site ativo e é assim que saberá que está funcionando!

Observação: talvez seja necessário abrir sua página em um navegador privado, caso ela esteja armazenada em cache.

Lembre-se: você nunca deve fazer alterações em seu site ativo com a possibilidade de quebrar alguma coisa! Use o Local, um aplicativo de desenvolvimento local gratuito para que você possa parar de depurar ambientes locais e passar mais tempo lançando lindos sites WordPress. Saiba mais sobre o local aqui.

Conclusão

A personalização é uma das melhores partes da criação de sites usando WordPress e, embora os temas sejam ótimos pontos de partida, é bom ter temas infantis, como o Divi, à sua disposição.

Baixar tema infantil Divi grátis

Uma das maneiras mais rápidas (e fáceis!) De criar um tema infantil é baixar este tema infantil Divi gratuito. Tem tudo o que você precisa para começar, além de espaço para personalizar ao seu gosto! Baixe seu tema infantil Divi gratuito abaixo.