Divi Child: Como criar um tema Divi Child para WordPress

Divi Child: Como criar um tema Divi Child para WordPress

Maicon Ramos

Por Maicon Ramos

27/02/2020
Divi Child: Como criar um tema Divi Child para WordPress

O que é Divi Child?

Divi child ou Divi filho na tradução, resumindo é uma extensão/complemento/subtema que herda tudo que tema Divi já tem, como funcionalidade, recursos, design, módulos, scripts e tudo mais.

Porque utilizar um tema Divi Child?

Criar um tema filho do Divi é uma ótima maneira de adicionar personalização avançada ao seu tema sem ter que se preocupar em apagar essas alterações sempre que você atualizar o tema do Divi.

É por isso que os temas filhos são a melhor e mais segura maneira de fazer alterações em um tema existente. Tanto para quem utiliza um Tema Divi como qualquer outro tema para WordPress.

Pode ser personalização de estilos(css), adicionar ou editar módulos, adicionar scripts que o Divi não tem, ou até algum código PHP no function.

Um tema Divi Child tem muitos benefícios. Organize melhor todo o seu CSS / Estilo personalizado em um só lugar, facilitando a colaboração com outras pessoas de sua equipe ou com seu cliente. Adicionar ou editar módulos, adicionar scripts JS que o Divi não tem, ou até algum código PHP no function, ou até criar um painel administrativo personalizado para seu WordPress.

Como Criar um tema Divi Child?

Para criar um tema Divi Child, você deve criar uma pasta “divi-child” no diretório de temas geralmente no caminho (/wp-content/themes/). 

Caminho do seu Divi Child

Nesta pasta, o único arquivo que você precisa criar é style.css. No cabeçalho do arquivo style.css que, na verdade são comentários css, onde deve ser especificar o tema pai Divi. 

Utilizando um editor de texto ou o seu editor favorito insira no style.css o seguinte:

/*
 Theme Name:     Divi Child
 Theme URI:      https://www.elegantthemes.com/gallery/divi/
 Description:    Divi Child Theme
 Author:         Elegant Themes
 Author URI:     https://www.elegantthemes.com
 Template:       Divi
 Version:        1.0.0
*/

Como essa folha de estilos é incluída após a folha de estilos do pai, ela substituirá qualquer estilo no arquivo style.css do tema Divi.

Para aplicar as modificações, o tema filho deve ser ativado. O tema pai ainda incluirá qualquer funcionalidade que não tenha sido substituída pelo tema filho.

Criar o Function.php do Divi child

Agora que temos o arquivo style.css em nosso divi child, precisamos garantir que não deixemos completamente de lado o style.css já existente no Divi (o tema principal). Isso significa que precisamos ter certeza de usar a folha de estilo principal do Divi e depois apresentar nossa nova folha de estilo. Essa ordem é importante porque, se você conhece o CSS, o código digitado na parte inferior sempre terá precedência sobre o código na parte superior. Portanto, no nosso caso, queremos que o código da folha de estilo pai seja carregado primeiro e depois o código da folha de estilo filho por último.

Fazendo isso estamos criando uma fila, Em outras palavras, qualquer coisa que adicionarmos à nossa folha de estilo do tema filho adicionará e substituirá o tema pai

Criei um arquivo com o nome “function.php” e utilizando novamente o seu editor, vamos adicionar o seguinte código ao arquivo:

<?php

function my_theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );

Lembrando que esse código é específico do tema divi para utilizar divi child, caso seja um tema diferente, veja a documentação ou tutorial do tema, ou siga a documentação oficial do WordPress, ou até utilize mesmo utilize um plugin que criar um tema filho automaticamente.

Plugin para criação de tema filho:

Se não está muito familiarizado com os códigos apresentados acima, pode utilizar um plugin que gera um tema filho:

Child Theme Configuratorhttps://wordpress.org/plugins/child-theme-configurator/

Plugin para criação de tema filho

Vale a pena?

Vale a pena utilizar tema filho no Divi? Depende, se for para fazer uma simples inclusão de algumas linhas css acredito que não seja necessário, já que o WordPress conta com o recurso de inserção de CSS nas opções de personalizar Tema. Agora se você já trabalha a um tempo com Divi vai acabar criando seu próprio CSS, scripts e funções PHP, e até módulos customizados, e utilizando em outros projetos futuramente. Uma alternativa viável também é comercializar o seu Child Theme Divi, prática muito utilizada no mercado.

Comentários

0 comentários
Enviar um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *