Дочерняя тема WordPress: как создать и зачем нужна — гайд для новичков

Что такое дочерняя тема и зачем она нужна

Дочерняя тема — это тема WordPress, которая «наследует» внешний вид и функциональность другой темы, которую называют родительской. Она не содержит полный код оформления, а только ваши изменения поверх родительской темы.

Представьте, что родительская тема — это готовый дом, а дочерняя — ваша перепланировка внутри. Вы можете перекрасить стены, добавить перегородки и поменять проводку, не разрушая несущие конструкции. При этом если архитектор (разработчик темы) выпускает обновление — дом обновляется, а ваша перепланировка остаётся на месте.

Главные причины использовать дочернюю тему:

1. Безопасность обновлений. Если вы правите файлы родительской темы напрямую, любое обновление темы затрёт все ваши изменения. С дочерней темой обновления проходят безболезненно.
2. Скорость отката. Сломали что-то в дочерней теме? Просто переключитесь обратно на родительскую — сайт снова работает.
3. Чистота кода. Все ваши правки лежат в одном месте, а не разбросаны по десяткам файлов чужой темы.
4. Переносимость. При смене темы вы не теряете свои функции — они живут в дочерней теме.

Подробнее о том, как вообще устроены темы и куда ставить код, читайте в нашем гайде о полезных сниппетах для functions.php.

Когда нужна дочерняя тема, а когда можно обойтись

Дочерняя тема — не панацея. Иногда она избыточна, а иногда — единственный правильный вариант. Вот сравнительная таблица, которая поможет решить:

Ситуация	Дочерняя тема	Почему
Хочу поменять цвета и шрифты	Не обязательна	Достаточно настроек кастомайзера или плагина
Добавляю CSS-стили к теме	Рекомендуется	Стили переживут обновление темы
Меняю шаблоны страниц (PHP)	Обязательна	Иначе правки сотрутся при обновлении
Добавляю функции в functions.php	Обязательна	Родительский functions.php перезаписывается при обновлении
Тема больше не обновляется разработчиком	Можно и без неё	Но лучше сменить тему или форкнуть её
Делаю сайт клиенту «на вырост»	Обязательна	Клиент сможет обновлять тему без риска сломать дизайн

Золотое правило: если вы собираетесь писать любой код поверх темы — делайте дочернюю. Это занимает пять минут, а экономит часы работы и нервы.

Как создать дочернюю тему вручную: два файла

Минимальная дочерняя тема состоит из двух файлов в папке /wp-content/themes/. Создайте папку, например mytheme-child, и положите в неё:

1. Файл style.css — здесь указывается, какая тема является родительской:

/*
Theme Name:   MyTheme Child
Theme URI:    https://delai-sait.ru/
Description:  Дочерняя тема для MyTheme — мои правки поверх родительской
Author:       Ваше имя
Author URI:   https://delai-sait.ru/
Template:     mytheme
Version:      1.0.0
*/

/* Ваши стили добавляйте ниже */

Ключевая строка — Template: mytheme. Здесь указывается папка родительской темы (не название!). Если родительская тема лежит в /wp-content/themes/twentyseventeen/, пишем Template: twentyseventeen.

2. Файл functions.php — подключаем стили и скрипты:

<?php
// Подключаем стили родительской и дочерней темы
function mytheme_child_enqueue_styles() {
    // Сначала стили родительской темы
    wp_enqueue_style( 'mytheme-parent-style', get_template_directory_uri() . '/style.css' );
    // Потом стили дочерней темы — они перекроют родительские
    wp_enqueue_style( 'mytheme-child-style', get_stylesheet_uri(),
        array( 'mytheme-parent-style' ), '1.0.0' );
}
add_action( 'wp_enqueue_scripts', 'mytheme_child_enqueue_styles' );

Теперь зайдите в админку: Внешний вид → Темы — дочерняя тема появится в списке. Активируйте её, и сайт продолжит работать как раньше, но теперь ваши правки в безопасности.

Как правильно подключить стили и скрипты

Самая частая ошибка новичка — подключить стили дочерней темы через обычный <link> в header.php. Так делать нельзя: WordPress требует подключения через wp_enqueue_style(), иначе стили могут загружаться в неправильном порядке или дублироваться.

Вот правильный вариант с учётом зависимостей и версии (версия поможет сбросить кэш браузера после правок):

<?php
function mytheme_child_enqueue_assets() {
    // Стили: дочерняя зависит от родительской
    wp_enqueue_style( 'mytheme-parent', get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'mytheme-child', get_stylesheet_uri(),
        array( 'mytheme-parent' ), filemtime( get_stylesheet_directory() . '/style.css' ) );

    // Скрипт: подключаем свой JS-файл из папки дочерней темы
    wp_enqueue_script( 'mytheme-custom', get_stylesheet_directory_uri() . '/js/custom.js',
        array( 'jquery' ), '1.0.0', true );
}
add_action( 'wp_enqueue_scripts', 'mytheme_child_enqueue_assets' );

Обратите внимание на функции:

• get_template_directory_uri() — путь к родительской теме;
• get_stylesheet_directory_uri() — путь к дочерней (активной) теме;
• пятый параметр true в wp_enqueue_script — загрузка скрипта в подвале, а не в head.

Пример содержимого js/custom.js — добавим кнопке класс при клике:

// Простой JS в дочерней теме
jQuery( document ).ready( function( $ ) {
    $( '.site-header' ).on( 'click', '.menu-toggle', function() {
        $( 'body' ).toggleClass( 'menu-open' );
    } );
} );

Если вы не используете jQuery, подключите обычный скрипт — WordPress умеет работать и с ванильным JS:

document.addEventListener( 'DOMContentLoaded', function() {
    var btn = document.querySelector( '.menu-toggle' );
    if ( btn ) {
        btn.addEventListener( 'click', function() {
            document.body.classList.toggle( 'menu-open' );
        } );
    }
} );

Как переопределять шаблоны родительской темы

Главная суперсила дочерней темы — переопределение шаблонов. WordPress устроен так, что если файл с тем же именем есть в дочерней теме, он используется вместо файла родительской.

Например, родительская тема выводит шапку из файла header.php. Скопируйте его в дочернюю тему и измените — WordPress возьмёт ваш вариант:

// В дочерней теме: /wp-content/themes/mytheme-child/header.php
// Это копия header.php родительской темы с вашими правками
// Например, добавим свой класс к body:

<body <?php body_class( 'my-custom-class' ); ?>>

Так можно переопределять header.php, footer.php, single.php, page.php, archive.php и любые другие шаблоны. Никаких специальных хуков не нужно — достаточно совпадения имени файла.

Иерархию шаблонов WordPress можно посмотреть в официальной схеме на developer.wordpress.org. А если вы работаете с кастомными типами записей, вам пригодится наш гайд о создании кастомных типов записей.

Как переопределять функции родительской темы

Файлы шаблонов переопределить легко, а вот функции — сложнее. Если родительская тема объявила функцию, вы не можете объявить её с тем же именем — будет фатальная ошибка.

Правильная стратегия — отключить родительскую функцию через хук и добавить свою:

<?php
// Родительская тема делает так:
// add_action( 'wp_head', 'mytheme_analytics' );

// В дочерней теме отключаем её и добавляем свою версию
function mytheme_child_remove_parent_analytics() {
    remove_action( 'wp_head', 'mytheme_analytics' );
}
add_action( 'wp_head', 'mytheme_child_remove_parent_analytics', 0 );

// И добавляем свою функцию с новым кодом
function mytheme_child_analytics() {
    echo '<!-- здесь мой код аналитики -->';
}
add_action( 'wp_head', 'mytheme_child_analytics' );

Важный нюанс: remove_action() сработает только если родительская функция была добавлена через add_action(), а не объявлена напрямую в шаблоне. Если функция вызывается прямо в файле header.php — переопределяйте шаблон (см. предыдущий раздел).

Чтобы отключить фильтр, используйте remove_filter() с теми же аргументами, что и в add_filter():

// Родительская тема:
// add_filter( 'excerpt_length', 'mytheme_excerpt_length', 20 );

// Дочерняя тема: отключаем и задаём свою длину
add_action( 'init', function() {
    remove_filter( 'excerpt_length', 'mytheme_excerpt_length', 20 );
} );

add_filter( 'excerpt_length', function( $length ) {
    return 40;
} );

Хукам и фильтрам посвящён отдельный материал — почитайте наш гайд о сниппетах для functions.php, там разобраны десятки готовых примеров.

Создание дочерней темы через плагин

Ручной способ — это два файла, вы уже умеете. Но если хочется быстрее или нужно создать дочернюю тему для сложной темы с десятками файлов — используйте плагин Child Theme Configurator.

Как это работает:

1. Установите плагин Child Theme Configurator из репозитория WordPress (бесплатный).
2. В админке: Инструменты → Child Themes.
3. Выберите родительскую тему из выпадающего списка.
4. Нажмите Analyze — плагин проверит тему на совместимость.
5. Нажмите Create New Child Theme — плагин сам создаст папку, style.css, functions.php и при необходимости скопирует нужные шаблоны.
6. Включите дочернюю тему и проверьте сайт.

Плагин также умеет анализировать, какие файлы темы вы уже правили, и перенести их в дочернюю тему — удобно при «переезде» с уже исправленной родительской темы.

Частые ошибки новичков

Вот пять ошибок, из-за которых дочерняя тема не работает или ломает сайт:

1. Неправильное имя в Template. В Template: пишется имя папки родительской темы, а не её название из style.css. Ошибка в этой строке — WordPress вообще не покажет дочернюю тему в списке.
2. Забыли подключить стили родительской темы. Без этого сайт «разденется» — пропадёт вся вёрстка. В functions.php обязательно подключайте и родительский, и дочерний style.css.
3. Правка родительской темы вместо дочерней. После активации дочерней темы убедитесь, что редактируете файлы именно в её папке. Многие редакторы открывают файлы родительской темы по привычке.
4. Дублирование функций. Если функция с тем же именем уже есть в родительской теме, объявление её в дочерней вызовет фатальную ошибку. Используйте remove_action() или переименуйте функцию.
5. Отсутствие бэкапа. Перед любыми правками делайте резервную копию. Как настроить автоматические бэкапы, читайте в статье о сайтах на WordPress.

Если что-то пошло не так и сайт выдал белый экран — не паникуйте. Подключитесь к серверу по FTP и переименуйте папку дочерней темы, например mytheme-child-disabled. WordPress автоматически откатится на родительскую тему.

Вывод

Дочерняя тема — это базовая гигиена WordPress-разработчика. Она занимает пять минут на создание, но защищает ваши правки от обновлений темы, упрощает откат при ошибках и держит код в одном месте.

Краткий план действий для новичка:

1. Создайте папку дочерней темы с style.css и functions.php.
2. Правильно укажите Template: — имя папки родительской темы.
3. Подключите стили через wp_enqueue_style(), не через <link>.
4. Переопределяйте шаблоны копированием файлов, а функции — через remove_action().
5. Перед каждым изменением делайте бэкап.

Если вам нужен сайт на WordPress под ключ — с правильно настроенной дочерней темой и безопасными обновлениями — посмотрите, как мы делаем сайты на WordPress и что входит в стоимость. А больше технических материалов для разработчиков — в разделе «Разработка WordPress» на delai-sait.ru.