Uma introdução aos temas filhos do WordPress

Entre os principais recursos do WordPress está a capacidade de criar um site com ótima aparência, mesmo que você não seja um designer. Através do uso de temas de terceiros, praticamente qualquer pessoa com um pouco de conhecimento técnico pode criar algo que pareça e funcione muito bem.

Adicione isso ao fato de que muitos temas são gratuitos ou acessíveis, e você pode ver por que tantas pessoas entraram no movimento.

Mas o que muitas pessoas podem não perceber é que instalar um tema e personalizá-lo para atender às suas necessidades não é o fim das coisas. A realidade é que, dependendo do tipo de personalização que você fez, essas alterações podem ser perdidas ao atualizar o tema no futuro.

Por exemplo, imagine usar o tema Twenty Seventeen – o tema padrão incluído no WordPress. Digamos que você editou diretamente um modelo de página ou até mesmo a folha de estilo. Embora hackear um tema existente seja uma ótima maneira de aprender os meandros do desenvolvimento, também é muito fácil eliminar todas essas alterações na próxima vez que você pressionar o botão de atualização. Se você fizer isso em um site ao vivo, pode ser desastroso.

Felizmente, há outra maneira mais segura de fazer as coisas.

Uma criança protege o futuro

É aqui que entra o conceito do WordPress Child Theme. Resumindo, é um tema separado que tem sua própria pasta dentro do diretório /wp-content/themes/ do seu site. No entanto, há uma reviravolta. Em vez de ser um tema completo, uma criança faz referência ao seu “pai”.

O que isso significa é que a pasta do seu tema filho contém apenas alguns itens básicos:

• Um arquivo functions.php .
• Uma folha de estilo ( style.css ) que contém apenas os estilos que você está personalizando ou adicionando.
• Apenas os arquivos de modelo que você deseja personalizar.

A beleza dessa configuração é que você ainda está aproveitando todas as vantagens que o tema pai tem a oferecer, além de adicionar seus próprios toques pessoais. A maior parte do trabalho duro de design e desenvolvimento já foi feito pelo autor do tema. A partir daí, você pode fazer tanto ou tão pouco quanto quiser.

Ainda melhor é que sempre que o tema pai é atualizado para a versão mais recente, o filho fica intocado. Embora isso não o proteja completamente contra quebras (chegaremos a isso mais tarde), isso significa que suas personalizações não serão substituídas. Isso é um grande negócio, já que não é divertido entrar e refazer todo o seu trabalho duro.

Configurando um tema filho básico

O processo inicial de configuração de um tema filho é bastante simples e deve levar apenas alguns minutos do seu tempo. Certamente, um pequeno preço a pagar, considerando os benefícios que ele oferece agora e no futuro.

Tomando o exemplo do tema Twenty Seventeen (e o conselho do WordPress Theme Handbook), vamos percorrer os temas filhos mais básicos:

1. Crie uma nova pasta em seu diretório /wp-content/themes/ . Ele pode ter o nome que você quiser, mas continuaremos com a recomendação do WordPress, chamando-o de: twentyseventeen-child

2. Crie uma nova folha de estilo e nomeie-a: style.css

Dentro desse arquivo CSS, coloque um título semelhante a este (você pode personalizá-lo para corresponder à sua configuração específica):

 /* Theme Name: Twenty Seventeen Child Description: My Twenty Seventeen Child Theme Author: Your Name Author URI: http://www.your-site.com Template: twentyseventeen Version: 1.0.0 */

Você pode colocar outros itens aqui, mas observe que as únicas áreas obrigatórias são o Nome do Tema e o Modelo. O nome pode realmente ser qualquer coisa que você gostaria que fosse – mas preste muita atenção à declaração de Template . Isso deve corresponder ao nome da pasta do seu tema pai ( twentyseventeen no nosso caso). Se essa referência não estiver correta, seu tema filho não funcionará.

Abaixo dessas informações, você pode adicionar qualquer estilo personalizado que gostaria de usar em seu tema filho. Se você estiver alterando estilos existentes, pode valer a pena copiá-los e colá-los diretamente da folha de estilos do tema pai ou usar as ferramentas de desenvolvedor do seu navegador para identificar facilmente os estilos que você deseja segmentar.

3. Crie um arquivo functions.php que, no mínimo, faça referência às folhas de estilo do seu tema pai e filho:

 <?php add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' ); function my_theme_enqueue_styles() { $parent_; // This is 'twentyseventeen-style' for the Twenty Seventeen theme. wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' ); wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array( $parent_style ), wp_get_theme()->get('Version') ); } ?>

*Código modificado do guia de tema filho do WordPress Theme Handbook.

É claro que o arquivo functions.php pode ser personalizado um pouco à medida que você desenvolve seu site. Mas, por enquanto, essa configuração básica pelo menos ajudará você a começar.

4. Copie qualquer um dos arquivos de modelo do tema pai (mantendo os originais no lugar) para a pasta do seu tema filho e modifique-os como desejar.

5. Dentro do Painel do WordPress, ative seu novo tema filho navegando até Aparência > Temas. Se você quiser que uma imagem apareça com seu tema, adicione um arquivo PNG de 1200×900 chamado screenshot.png ao diretório raiz do tema filho.

Miudezas

Viu como foi fácil? A criação desse tema filho quase não levou tempo, e você também fez isso no seu site. Mas há algumas coisas que você deve saber:

As coisas ainda podem quebrar

Embora um tema filho proteja suas alterações de serem substituídas, isso não garante que você ficará livre de problemas para sempre. Há momentos em que um tema pai introduz novos recursos ou até muda radicalmente modelos específicos.

Isso pode causar problemas imprevistos com qualquer modelo ou estilo personalizado que resida em seu tema filho. O resultado é que você pode ter que refazer alguns de seus trabalhos anteriores usando novas cópias dos modelos em questão.

Você está usando o pai certo?

Parece quase bobo, mas se você estiver fazendo grandes mudanças nos modelos, é justo se perguntar se você escolheu o tema pai certo para começar. Lembre-se, a ideia de um tema filho é fazer (e preservar) alguns ajustes personalizados – não destruir completamente o original. Você vai querer trabalhar com um tema pai que seja pelo menos 75% ou mais do que você está procurando.

Caso contrário, você pode ficar melhor com um tema ou estrutura inicial.

A documentação do tema pai é sua amiga

Nem todos os temas são criados da mesma maneira. Portanto, embora a configuração rápida mencionada acima funcione, pode não ser ideal para o seu tema pai específico. Confira a documentação do seu tema para ver se há alguma consideração especial para criar um filho (isso está realmente começando a soar como um artigo sobre pais).

Parabéns pelo seu filho (tema)

Temas filhos são um daqueles pequenos truques legais do WordPress que podem economizar algum tempo e algumas dores de cabeça futuras.

Eles são altamente recomendados para situações em que você deseja aproveitar tudo o que um tema de terceiros tem a oferecer e ainda ter a capacidade de adicionar suas próprias personalizações ao mix.