Como criar um tema filho do WordPress

Leitura de 2 minutos
Jiangsu
2025-08-22
2025-10-29
2,776
Eu recebo uma comissão quando você faz compras através dos links abaixo, sem custo adicional para você.

Está personalizando seu tema do WordPress, mas quer ficar bem seguro? Não se preocupe. Nós o ajudamos. Leia o artigo a seguir e você poderá personalizar seu tema do WordPress usando um tema filho do WordPress. O que um tema filho do WordPress faz é salvar suas personalizações em uma pasta diferente para que a atualização do tema pai não as prejudique.

O que significa subtema?

Basicamente, um tema filho é um reflexo de qualquer tema. A ideia aqui é que, quaisquer que sejam as alterações feitas no tema filho, o tema pai não será afetado, mas quaisquer alterações feitas no tema pai serão refletidas no tema filho.

Se você precisa usar um tema filho

Não há dúvida de que usar um tema filho é a maneira mais segura de modificar um tema. A melhor parte é que, mesmo que o tema principal seja atualizado, suas alterações não serão excluídas. Se tiver algum problema ao modificar um tema filho, você poderá excluí-lo facilmente para voltar ao tema pai.

Configuração de um tema filho do WordPress

Você pode configurar os temas filhos do WordPress manualmente ou com a ajuda de plug-ins.

Um aspecto que você precisa lembrar é que isso não funcionará até que o tema principal apareça na página Temas, em Aparência.

Método 1: Criar manualmente um tema filho

#1Em primeiro lugar, você precisa criar uma nova pasta e nomeá-la de acordo com sua vontade, por exemplo, “twentytwentyfour-child”.

#2:Em seguida, crie um arquivo e nomeie-o “style.css”; observe que esse arquivo deve existir.

#3Agora você precisa abrir esse arquivo criado recentemente e inserir as seguintes informações nele.

/*
Theme Name:     Twenty Twenty-Four Child
Theme URI:      https://example.com/twentytwentyfour-child/
Description:    This is a child theme for Twenty Twenty-Four, created by me.
Author:         Your Name
Author URI:     https://example.com
Template:       twentytwentyfour
Version:        1.0.0
*/

Explicação dos principais parâmetros.

  • Theme Name:.(obrigatório)O nome de seu tema filho.
  • Template:.(obrigatório)isto émais críticode uma linha. Ela devecorrespondência perfeitaO nome do diretório de seu tópico pai. Por exemplo, o tópico pai é twentytwentyfourAqui, preencha os espaços em branco. twentytwentyfourO tema principal é DiviAqui, preencha os espaços em branco. Divi.O caso deve ser consistente
  • DescriptionDescrição do subtema: Uma breve descrição do subtema.
  • AuthorSeu nome.
  • Author URISeu endereço de website.
  • VersionNúmero da versão do subtópico: O número da versão do subtópico.

Embora o CSS do tema filho seja carregado automaticamente, oEle não herda automaticamente todos os estilos do tema principal. Uma prática muito comum e recomendada para se ter um ponto de partida completo e confiável para seus subtópicos é.Primeiro, importe a folha de estilo completa do tema principal

Você pode adicionar um CSS personalizado ao seuantecipadamenteUso @import regras para que isso aconteça.

/*
Theme Name:     Twenty Twenty-Four Child
Theme URI:      https://www.likacloud.com/twentytwentyfour-child/
Description:    This is a child theme for Twenty Twenty-Four, created by me.
Author:         Your Name
Author URI:     https://example.com
Template:       twentytwentyfour
Version:        1.0.0
*/

/* 导入父主题的样式以确保设计基础一致 */
@import url("../twentytwentyfour/style.css");

/* 自定义样式从这里开始 */

/* 1. 更改文章标题颜色 */
.wp-block-post-title {
    color: #1a4f6e;
    font-weight: 700;
}

/* 2. 更改网站背景色 */
body {
    background-color: #f8f9fa;
}

/* 3. 更改主内容区域的宽度 */
.wp-block-group.alignwide {
    max-width: 1280px;
}

/* 4. 自定义链接颜色 */
a {
    color: #d14545;
}
a:hover {
    color: #a23434;
    text-decoration: none;
}

tomar nota de

mesmo que @import é a abordagem mais simples, mas não é a ideal do ponto de vista do desempenho (pois impede o carregamento paralelo). Uma abordagem mais avançada é usar wp_enqueue_style() na função functions.php para adicionar a folha de estilo do tema pai à fila. No entanto, para começar, usar o @import É totalmente viável e fácil de entender.

Assim:

<?php
// 确保在正确的钩子上加载样式
add_action('wp_enqueue_scripts', 'enqueue_parent_and_child_styles');

function enqueue_parent_and_child_styles() {
    // 加载父主题样式
    wp_enqueue_style('parent-style', get_template_directory_uri() . 'https://www.likacloud.com/style.css');
    
    // 加载子主题样式,并指定依赖于父主题样式
    // 这样可以确保子主题样式在父主题样式之后加载,保证样式覆盖生效
    wp_enqueue_style('child-style', 
                     get_stylesheet_directory_uri() . 'https://www.likacloud.com/style.css',
                     array('parent-style'), // 依赖关系
                     wp_get_theme()->get('Version') // 版本号,可选
                    );
}

Explicação do código:

  1. add_action('wp_enqueue_scripts', 'enqueue_parent_and_child_styles')Montagem de funções personalizadas nos ganchos de carregamento de estilo do WordPress
  2. get_template_directory_uri()Obter o URL do diretório de tópicos pai
  3. get_stylesheet_directory_uri()Obter o URL do diretório do subtópico (quando o subtópico estiver ativo)
  4. array('parent-style')Declare os estilos do tema filho como dependentes dos estilos do tema pai para garantir a ordem correta de carregamento

Essa abordagem se compara favoravelmente com @import é mais eficiente porque permite que os navegadores carreguem as folhas de estilo em paralelo e gerenciem melhor as dependências entre os estilos.

Você pode simplesmente adicionar esse código à seção functions.php (ou crie um, se ele não existir), mantendo o tema filho que você já tem no lugar style.css As informações de anotação do cabeçalho são suficientes.

Todos os outros detalhes podem ser alterados para atender às suas necessidades.

Depois de fazer isso, você deve acessar Appearance >> Themes (Aparência >> Temas) e verificar se o tema filho foi criado. Se tiver sido, parabéns, você pode ativá-lo para testar se ele herda o design do tema pai.

Método 2: Use o plug-in para criar um tema filho

Se não gostar de fazer isso manualmente, você pode usar um plug-in gratuito do WordPress para fazer o trabalho por você. Existem muitos plug-ins gratuitos que podem criar temas filhos para você e evitar que tenha de fazer tudo isso manualmente. Nós usaremosConfigurador de tema filhomas você pode usar qualquer um dos plug-ins disponíveis.

Como criar um tema filho do WordPress - LikaCloud

#1: Em primeiro lugar, você precisa fazer o download Configurador de tema filho Plug-ins.

#2: Agora, faça login no seu site e acesse o painel de controle.

#3: Navegue até Plugins e, em seguida, a opção Add New.

#4:Agora, você precisa carregar o plug-in que acabou de baixar clicando na opção “Upload Plugin” e, em seguida, ativá-lo.

#5:É importante certificar-se de que você ativou o tema para o qual deseja criar um tema filho.

#6: Isso pode ser feito simplesmente navegando até a seção Tools (Ferramentas) e clicando em um subtópico.

#7: Agora, clique no botão Analyse e crie seu tema filho de acordo com as configurações mencionadas no plug-in.

#8: Agora você precisa clicar na opção “Create new child theme” (Criar novo tema filho).

Edição de outros arquivos de modelo

Você deve escrever essa função no tema filho, caso deseje adicionar funções personalizadas a ele. Sinta-se à vontade para usar o tema filho para criar qualquer alteração estrutural ou de layout no tema pai.

Supondo que você tenha criado o twentytwentyfour tema filho que você deseja alterar a maneira como ele exibe as páginas únicas. O local da página única é twentytwentyfour-child/template-parts/content-single.php

#1:Na pasta do tema filho, crie um arquivo content-single.php. Você precisa ter muito cuidado com o nome e a estrutura. Eles precisam ser os mesmos do tema pai para que possam ser substituídos.

#2: Em seguida, você precisará criar uma nova pasta e colocar esse arquivo nela, mas tenha cuidado com o caminho e certifique-se de que ele seja exatamente igual ao caminho do tema principal.

#3: É isso aí. Nesta etapa, tudo o que você precisa fazer é escrever o código desejado em content-single.php, que substituirá o arquivo pai.

Cuidado: Certifique-se de que o nome do arquivo e o caminho da pasta sejam os mesmos.

Esperamos que agora você possa criar temas filhos com facilidade. Se tiver alguma dúvida, adicioneGrupo QQ 1398231Discussão.

Veja os provedores de hospedagem em nuvem recomendados para WordPress