O que é um tema infantil e como criar um no WordPress

Introdução

Os temas filhos do WordPress são temas que funcionam em conjunto com um tema WordPress real (pai) e herdam todas as suas funções, caraterísticas e estilo. Os temas filhos do WordPress são o principal método de personalização de temas.

O conceito de tema pai-filho foi desenvolvido pelo tema central do WordPress para permitir que os utilizadores personalizem os seus temas de forma eficiente e segura. Como todos sabemos, os temas do WordPress são actualizados regularmente. Quando um tema é atualizado, todas as alterações personalizadas que foram feitas anteriormente são substituídas. Anteriormente, não era possível atualizar um tema WordPress sem perder essas alterações personalizadas. Os utilizadores tinham duas opções: ou desperdiçavam os seus esforços e perdiam o seu trabalho, ou expunham o seu sítio a riscos de exploração devido a vulnerabilidades de segurança do tema desatualizado. Ao contrário dos temas principais, os temas secundários permitem que as personalizações permaneçam separadas e não sejam afectadas pela atualização do tema principal.

Quando é que se deve utilizar um tema infantil do WordPress?

Em primeiro lugar, é preciso saber que nem todos os temas WordPress foram desenvolvidos de acordo com o conceito de tema pai-filho. Os temas principais do WordPress são frequentemente designados por estruturas de temas, que contêm os seus próprios ganchos e filtros. É necessário escolher cuidadosamente o tema principal e certificar-se de que é fácil de utilizar e funciona corretamente quando configurado como tema secundário.

Em segundo lugar, é necessário determinar o objetivo da criação de um tema filho. Há situações em que esta não é a solução mais eficaz, dependendo do que se pretende alcançar.

Se estiver a utilizar um tema personalizado que tenha sido desenvolvido especificamente para si, não é essencial criar um tema filho, uma vez que não existe o risco de as suas alterações se perderem. Não considere isto como uma recomendação para não utilizar um tema filho, mas como uma opção possível. Se não quiser editar diretamente os ficheiros do seu tema, pode optar por um tema filho se o seu tema personalizado permitir essa configuração. Além disso, a edição de ficheiros de temas está sempre associada a um certo risco, especialmente se não for um programador experiente.

Se o seu objetivo é adicionar uma funcionalidade específica em vez de fazer personalizações relacionadas com o design, utilizar um plugin ou codificar um plugin pode ser uma abordagem mais adequada. Nesse cenário, pode manter a funcionalidade se decidir mudar do tema atual para outro. No entanto, se a funcionalidade for implementada no tema filho, perder-se-á.

Como funciona um tema filho do WordPress?

Como já foi referido, o tema secundário herda o design e a funcionalidade do tema principal, mas como é que isso funciona exatamente?

O tema filho contém instruções especiais que informam o WordPress de que se trata de um tema filho e qual é o verdadeiro tema filho. Tema dos pais é. O WordPress utiliza então o código do tema principal e substitui apenas as partes necessárias pelo código definido no tema secundário.

Cada tema filho deve ter dois ficheiros necessários: um ficheiro de folha de estilos (style.css) e um ficheiro de funções (functions.php). O ficheiro de folha de estilos contém um texto comentado que indica ao WordPress que se trata de um tema secundário e qual é o tema principal. O ficheiro de funções contém uma função que mapeia o ficheiro de folha de estilos do tema principal para que a folha de estilos do tema secundário seja carregada primeiro. Também é utilizado para adicionar determinadas funções, inserindo o código necessário no ficheiro.

Dependendo do que pretende alcançar, pode ser necessário criar ficheiros adicionais no tema filho, por exemplo, ficheiros de modelos, partes de modelos, ficheiros de inclusão, etc.

O maior desafio quando se trabalha com temas infantis é provavelmente aprender a utilizá-los. As estruturas robustas requerem um certo grau de familiarização, uma vez que cada estrutura tem os seus próprios ganchos e filtros.

Antes de iniciar a criação efectiva de um tema filho, recomendamos vivamente que trabalhe num site de desenvolvimento ou de teste. Felizmente, aqui na ORC Webhosting GmbH, oferecemos o staging WordPress com um clique, para que possa testar facilmente tudo antes de o colocar em direto no seu site de produção.

Criar um tema subordinado

Para criar um tema infantil WordPress básico, é necessário criar os dois ficheiros necessários mencionados acima (folha de estilo e ficheiro de função) numa pasta nova e independente.

Este guia fornece um exemplo utilizando o tema padrão do WordPress Twenty Twenty.

Criar uma pasta para um tema secundário

Em primeiro lugar, deve ser criada uma nova pasta para os ficheiros do tema infantil. Esta pasta deve estar localizada no diretório de temas do WordPress (wp-content/themes). Recomenda-se que a pasta tenha o nome do tema principal, seguido de "-child", por exemplo, "twentytwenty-child".

É possível criar uma nova pasta com o nome introduzido em Gestor de ficheiros integrado no cPanel ou com o seu cliente FTP favorito.

Criar um ficheiro de folha de estilos

Depois de ter criado a nova pasta, deve criar um ficheiro com o nome style.css.

Este ficheiro contém as regras CSS que controlam o aspeto do seu tema. É necessário incluir o seguinte comentário de cabeçalho, que contém informações básicas sobre o tema e informa ao WordPress que ele é um tema filho do tema pai definido.

/*
Nome do Tema: Twenty Twenty Child
URI do tema: http://meinewebseite.ch
Descrição: Twenty Twenty Child Theme
Autor: John Smith
Autor URI: http://meinewebseite.ch
Modelo: twentytwenty
Versão: 1.4
Licença: GPLv2 ou posterior
Licença URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: blog, one-column, custom-background, custom-colors, custom-logo, custom-menu, editor-style, featured-images, footer-widgets, full-width-template, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, block-styles, wide-blocks, accessibility-ready
*/

Se escrever o comentário no ficheiro style.css Se pretender inserir um novo tópico, certifique-se de que o insere no topo e substitua os detalhes pelas informações do tópico.

Os pormenores mais importantes a que deve prestar atenção são os seguintes

Nome do tópico - É necessário atribuir um nome único ao tópico subordinado.
Modelo - É necessário introduzir o nome do diretório do tema principal. Esta linha só existe nos temas subordinados e não funcionará corretamente sem ela. No nosso caso, o diretório do tema é "twentytwenty". Se estiver a utilizar um tema diferente, certifique-se de que substitui esta linha em conformidade. Pode verificar isso em wp-content/themes.

Os restantes pormenores encontram-se no seu Painel de administração do WordPress > Ver > Temas > Detalhes do tema.

Se alterar os dados conforme necessário, certifique-se de que guarda o ficheiro.

Criar ficheiro de funções

Para garantir que os estilos do tema principal são corretamente integrados, deve ser criado um novo ficheiro chamado functions.php no diretório do tema secundário. Caso contrário, o tema secundário aparecerá sem estilo e incorreto.

O método ideal para carregar folhas de estilo em fila é que o tema pai carregue as folhas de estilo dos temas pai e filho. No entanto, nem todos os temas do WordPress fazem isso. Por conseguinte, é necessário verificar o código do tema principal para saber como funciona e descobrir o nome do identificador que o tema principal utiliza. O identificador é o primeiro parâmetro da função wp_enqueue_style().

Se o desenho principal carregar o estilo com uma função que comece por get_template o desenho filho só tem de carregar os estilos filhos através do identificador do elemento pai no parâmetro de dependência.

get('Version') // isto só funciona se tiveres Version no cabeçalho do estilo
    );
}

Se o desenho principal carregar o estilo com uma função que seja compatível com get_stylesheet o desenho filho deve carregar as folhas de estilo pai e filho. Deve certificar-se de que utiliza o mesmo nome de identificador que o desenho principal utiliza para as folhas de estilo principais.

parent()->get('Version')
    );
    wp_enqueue_style( 'child-style', get_stylesheet_uri(),
        array( $parenthandle ),
        $theme->get('Version') // isto só funciona se tiveres Version no cabeçalho do estilo
    );
}

Se o código correspondente for introduzido no ficheiro functions.php não se esqueça de guardar o ficheiro.

Isto completa a criação do tema filho. Agora só precisa de ser ativado.

Ativar o tema filho

O último passo é ativar o tema filho. Para o fazer, inicie sessão no seu painel de administração do WordPress e navegue até Appearance > Themes (Aparência > Temas) através do menu do lado esquerdo.

Na página "Tópicos", encontrará o seu novo tópico subordinado entre os outros Temas para WordPress. Mova o ponteiro do rato sobre ele e clique no botão "Ativar".

Depois de o ter feito, o seu novo tema filho funcionará.

Note que não notará qualquer diferença no aspeto e no comportamento do seu sítio Web, uma vez que não efectuámos quaisquer ajustes estilísticos ou funcionais.

Pode agora começar a fazer as personalizações que quiser sem se preocupar que o seu trabalho se perca quando o design for atualizado.

Parabéns! Neste guia, aprendeu a criar temas filhos do WordPress e a aplicar com segurança alterações funcionais e de design ao seu sítio Web. Esperamos que tenha conseguido seguir as nossas instruções sem problemas e alcançar o resultado pretendido.