Дочірня тема (child theme) — це окрема тема WordPress, яка успадковує весь функціонал і стилі батьківської теми, але дозволяє безпечно вносити зміни. Без дочірньої теми будь-яке оновлення батьківської теми затре ваші правки.
Навіщо потрібна дочірня тема
Коли ви редагуєте файли батьківської теми напряму, наступне оновлення затре всі зміни. Дочірня тема вирішує цю проблему: ваші зміни зберігаються окремо і не втрачаються під час оновлень.
Створення дочірньої теми вручну
Створіть папку wp-content/themes/your-child-theme/ і два файли:
style.css
/*
Theme Name: My Child Theme
Template: twentytwentyfour
Description: Child theme for Twenty Twenty-Four
Version: 1.0
*/
/* Тут ваші власні стилі */
.site-header {
background: #1a1a2e;
}functions.php
<?php
add_action('wp_enqueue_scripts', 'child_theme_enqueue_styles');
function child_theme_enqueue_styles() {
$parent_style = 'parent-style';
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')
);
}twentytwentyfour).Структура дочірньої теми
| Файл | Призначення |
|---|---|
| style.css | Метадані теми + ваші стилі |
| functions.php | Підключення стилів батька + хуки |
| screenshot.png | Прев'ю в панелі тем (880×660 px) |
| template-parts/ | Перевизначені частини шаблону |
Перевизначення шаблонів
Скопіюйте потрібний файл з батьківської теми в папку дочірньої з тим самим шляхом — WordPress автоматично використає файл з дочірньої теми:
# Наприклад, перевизначити header.php:
cp wp-content/themes/twentytwentyfour/header.php wp-content/themes/my-child-theme/header.php
# Тепер редагуйте дочірній файлЧасті помилки дочірніх тем
| Повідомлення або симптом | Причина |
|---|---|
| The parent theme is missing | У полі Template у style.css вказано неправильне ім'я папки батьківської теми — помилка або неправильний регістр |
| Стилі дочірньої теми не застосовуються | Стиль дочірньої теми підключений з тим самим пріоритетом, що й батьківський, і батьківський завантажується пізніше |
| Fatal error: Cannot redeclare function | Функція з таким самим іменем уже оголошена в батьківській темі — потрібно перейменувати функцію в дочірній темі |
| Після зміни теми сайт виглядає без стилів | Активовано дочірню тему, але батьківську тему видалено з wp-content/themes |
Дочірня тема проти плагіна для кастомізації
| Критерій | Дочірня тема | Плагін з хуками |
|---|---|---|
| Перевизначення шаблонів теми | Так, прямим копіюванням файлів | Ні, лише через фільтри і хуки |
| Переживає зміну теми | Ні, прив'язана до батьківської теми | Так, працює з будь-якою темою |
| Підходить для стилів і верстки | Так, основний інструмент | Обмежено |
| Підходить для бізнес-логіки | Не рекомендується змішувати | Так, логіка має жити в плагіні |
Коли дочірня тема не підходить
- Правки не стосуються шаблонів і стилів теми, а додають функціональність (довільні типи записів, інтеграції) — для цього потрібен окремий плагін
- Батьківська тема — конструктор з власним візуальним редактором, який не читає файли дочірньої теми
- Планується повна зміна теми найближчим часом — перевизначені шаблони доведеться переписувати заново під іншу тему
- Зміни потрібні лише в контенті сторінок, а не в коді — для цього достатньо редактора блоків
Перевірка результату
# Переконатися, що активна саме дочірня тема
wp theme list --status=active --fields=name,status
# Перевірити, що style.css дочірньої теми дійсно віддається браузеру
curl -sI https://example.com/wp-content/themes/my-child-theme/style.cssЯкщо wp theme list показує активною батьківську тему — активація дочірньої не пройшла, поверніться до кроку з Template у style.css. Суміжні матеріали: пришвидшення WordPress і команди WP-CLI.
Дочірні теми і конструктори на кшталт Elementor/Divi
Якщо сайт зібрано у візуальному конструкторі сторінок, частина кастомізацій (глобальні стилі, шаблони шапки і підвалу) зберігається не у файлах теми, а в базі даних самого конструктора. Дочірня тема в цьому разі все одно корисна для правок style.css і functions.php, але не замінює резервне копіювання налаштувань конструктора — їх потрібно експортувати окремо через вбудований експорт/імпорт шаблонів, інакше перенесення теми на інший сайт не перенесе верстку, зібрану в конструкторі.
Часті питання
Що станеться з сайтом, якщо випадково видалити батьківську тему, поки активна дочірня?
Сайт залишиться без стилів і частини функціональності: дочірня тема зберігає лише зміни і сама по собі не містить повного коду верстки — вона підключає стилі і шаблони батька через код у functions.php. Без батьківської теми в папці тем WordPress не знайде, що успадковувати, і візуально сайт розвалиться, навіть якщо дочірня тема формально лишається активною.
Чи потрібна дочірня тема для сайту, зібраного в Elementor чи Divi?
Так, але її роль обмежена: правки style.css і functions.php, як і раніше, захищені від оновлень батьківської теми. А от глобальні стилі, шаблони шапки і підвалу самого конструктора зберігаються в базі даних, а не у файлах теми, тому дочірня тема їх не переживе при перенесенні — такі налаштування потрібно експортувати окремо через вбудований інструмент конструктора.
Чи можна назвати функцію в дочірній темі так само, як у батьківській?
Ні — якщо батьківська тема вже оголосила функцію з таким іменем, спроба оголосити її повторно в дочірній темі спричиняє фатальну помилку PHP про повторне оголошення. Рішення просте: дати функції в дочірній темі унікальне ім'я з власним префіксом і підключити її до потрібного хука через add_action або add_filter, а не покладатися на збіг імені з батьківською функцією.
Що робити, якщо потрібно додати довільний тип записів чи складну функціональність, а не просто змінити стилі?
Для функціональності на кшталт довільних типів записів чи інтеграцій дочірня тема — не найкращий інструмент: при зміні теми такий код зникне разом з нею. Логіку подібного роду правильніше виносити в окремий плагін, який переживе зміну будь-якої теми, а дочірню тему залишити лише для стилів, верстки і перевизначення шаблонів.