Crie e personalize um tema filho do WordPress

Publicados: 2020-09-29

Se você deseja fazer alterações no seu tema do WordPress, provavelmente já ouviu falar que uma boa maneira de fazer isso é criar e personalizar um tema filho do WordPress . Mas você sabe o que é um tema filho e por que é bom usá-lo? Se não, você está no lugar certo.

Tema filho do WordPress

Ter um tema filho implica que também há um tema pai. Um relacionamento pai-filho é algo que você já ouviu falar se souber um pouco sobre codificação. Quando se trata de WordPress, especificamente, temos um relacionamento pai-filho em tipos de postagem personalizados, por exemplo. A classe de um filho ou um tema é algo que tem as características de seu pai, mas pode ter mais características adicionadas a ele, o que o tornará diferente de seu pai. Ao falar em termos de temas, um tema filho é instalado junto com o tempo pai. Um tema filho nos permite alterar os temas pai, mas de maneira segura, sem editar diretamente o tema pai . Basicamente, um tema filho terá a maior parte de sua configuração de design igual ao tema pai. Mas, se você fizer algumas alterações, essas alterações substituirão as configurações iniciais.

Razões para usar um tema filho

Caso você esteja se perguntando por que não fazer alterações diretamente no tema pai, explicaremos agora. A principal razão pela qual não é uma boa ideia fazer isso é por causa das atualizações do tema. Para que seu site funcione corretamente, você deseja aplicar atualizações . No entanto, se você personalizar o tema pai, perderá todas as alterações sempre que atualizar o tema, pois as alterações serão substituídas.

Atualizar.
As atualizações são importantes para a segurança do seu site

Como funcionam os temas filhos do WordPress

Um tema filho é armazenado em um diretório separado do tema pai. Cada vez tem seus próprios arquivos style.css e functions.php. Embora você deva ter pelo menos dois arquivos no diretório do tema filho, para que funcione corretamente, você também pode adicionar outros arquivos. Os dois arquivos mínimos podem ajudá-lo a alterar o estilo, a codificação e os scripts e os parâmetros de layout. Quando um usuário visita seu site, o WordPress carrega o tema filho e preenche os estilos e funções ausentes usando parte do tema pai. Isso permite que você obtenha o melhor do seu tema filho e personalize-o, sem sacrificar a funcionalidade principal do tema pai.

Como criar um tema filho

Existem várias maneiras de criar um tema filho. Você pode fazer isso manualmente, usando um cliente FTP ou um diretório de arquivos, ou pode criar um tema filho usando um plug-in ou um gerador online.

WordPress, código é poesia.
Sem plugins, alguma codificação será necessária

Manualmente

Para criar manualmente um tema filho, você precisará usar um cliente FTP ou um gerenciador de arquivos. Além disso, observe que aqui vamos criar um arquivo style.css baseado no tema Twenty Seventeen.

  • Através de um cliente FTP ou gerenciador de arquivos, acesse sua pasta public_html > wp-content > temas
  • Aqui, você deve criar uma Nova Pasta. As convenções dizem que você deve nomear essa pasta com o nome do tema pai, mas adicione -child como sufixo. Aqui, o nome da nova pasta será twentyseventeen-child.
  • Crie um arquivo style.css dentro da pasta e adicione este código a ele: 
 /* Theme Name: Twenty Twenty Child Theme URL: http://yourdomain.com Description: Twenty Twenty Child Theme Author: Your Name Author URL: http://yourdomain.com Template: twentytwenty Version: 1.0.0 Text Domain: twentytwenty-child */
  • Ajuste os valores conforme necessário. Preste atenção extra à linha Template, pois ela informa ao WordPress a qual tema pai seu tema filho está relacionado. Quando terminar, salve suas alterações e feche.
  • Usando um editor de texto, crie outro arquivo chamado functions.php, mas não copie o código do tema pai. Copie e cole este código lá no arquivo em branco:
 <?php add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' ); function enqueue_parent_styles() { wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' ); } ?>
  • Depois de salvar e fechar este arquivo, visite seu site e vá para Aparência> Tema. Ative o tema filho e você notará que ele se parece com o tema pai.

Usando um plugin de tema filho

Usar um plugin de tema filho pode ser mais fácil e intuitivo. Aqui estão alguns dos plugins que você pode usar o Child Theme Generator, Child Theme Configurator ou Child Theme Wizard, por exemplo. Tenha em mente que usar plugins também requer algum conhecimento. Por exemplo, você pode precisar desabilitar um plugin, sem acessar sua área de administração, pois pode chegar um momento em que você não terá esse acesso. E é preciso alguma habilidade para fazer isso. No entanto, no geral, os plugins geralmente são fáceis de trabalhar, então não tenha medo de usá-los.

Usando um gerador online

Usar um gerador de tema filho online torna esse processo ainda mais fácil. Você só precisa acessar https://childtheme-generator.com e seguir as etapas. Ao criar e baixar o tema, vá para Aparência> Tema e faça o upload e ative seu tema filho.

Como personalizar o tema filho

Para personalizar seu tema filho, você precisa saber como inspecionar elementos na página da Web e entender as regras básicas de CSS. Para personalizar seu tema filho, no tema filho ativo, vá em Personalizar>CSS Adicional.

Hora de mudar.
Se você quiser fazer algumas alterações, isso é o que você precisa fazer

Alterar cor de fundo

O fundo certo desempenha um papel importante na aparência do site. Embora você possa adicionar uma imagem de plano de fundo no WordPress, aqui vamos falar sobre como alterar a cor de plano de fundo do seu tema filho. Para fazer isso, adicione esta regra CSS:

.site-content-contain {

cor de fundo: #DEF0F5;

posição: relativa;

}

Lembre-se de que você pode alterar o valor após a cor de fundo. Este valor específico é um valor de azul claro.

Alterar a cor da barra lateral

Esta é a regra CSS que você deve inserir para alterar a cor da barra lateral:

.widget {

fundo: #B9EBFA;

preenchimento: 25px;

Personalize tipos de fonte, tamanho e cor

Para alterar o tipo de fonte, tamanho e cor do seu tema filho do WordPress, insira o código abaixo. Observe que a marca p representa o texto do parágrafo.

p {

cor: cerceta;

}

p {

família de fontes: Geórgia;

tamanho da fonte: 18px;

}

Você também pode alterar o texto de outras partes, como título e cabeçalho, mas precisa inspecionar os elementos, localizar o link de estilo CSS, copiá-lo e alterar os valores conforme necessário.

Conclusão

Se você deseja personalizar um tema, sem alterar diretamente seu código, os temas filhos são uma ótima maneira de fazer isso. Com este guia, você poderá criar e personalizar um tema filho do WordPress e usá-lo para muitas tarefas diferentes . A melhor parte é que você não perderá suas alterações após atualizar o tema pai.