Содержание статьи
Скопируйте каталог базового оформления, но только частично. Не повторяйте весь шаблон – дублирование мешает масштабируемости. Достаточно структуры: style.css
, functions.php
, папки с кастомными скриптами и стилями. В заголовке style.css
обязательно укажите Template: имя-родителя
, иначе WordPress не свяжет компоненты.
Добавление стилей происходит через functions.php
. Не подключайте файлы напрямую – используйте хук wp_enqueue_scripts
. Пример:
add_action(\'wp_enqueue_scripts\', function() {
wp_enqueue_style(\'child-style\', get_stylesheet_uri(), [\'parent-style\'], wp_get_theme()->get(\'Version\'));
});
Аргумент [\'parent-style\']
привязан к wp_enqueue_style
родительской оболочки. Он должен совпадать по идентификатору. Если этого не сделать, могут пропасть стили или слететь верстка.
Важно: порядок подключения стилей критичен. Сначала родитель, затем пользовательская надстройка.
Не редактируйте файлы в wp-content/themes/основа
. Любое обновление перезапишет кастомные правки. Правильный путь – изоляция через персональный подпроект. Это точка входа для всех модификаций: хуки, фильтры, шорткоды, индивидуальная логика.
Добавление нового функционала – только через functions.php
надстройки. Пример подключения кастомного скрипта:
add_action(\'wp_enqueue_scripts\', function() {
wp_enqueue_script(\'child-js\', get_stylesheet_directory_uri() . \'/js/custom.js\', [], false, true);
});
Следите за приоритетами. Некоторые фильтры родителя могут перекрывать пользовательскую логику. Проверяйте наличие уже существующих хуков с помощью has_filter()
и удаляйте ненужные через remove_filter()
.
Обратите внимание на template hierarchy
. Переопределение шаблонов работает только при строгом соблюдении имен. Нельзя просто создать page-about.php
и ждать результата. Структура должна совпадать с внутренней логикой ядра. Убедитесь, что файлы находятся именно в надстройке, а не в родителе.
Внимание! Убедитесь, что надстройка активирована через админку. Без этого вся структура игнорируется.
Обновляйте родительский шаблон, не боясь потерь. Правильная изоляция гарантирует стабильность даже при глобальных изменениях. Работайте через API. Не нарушайте внутреннюю архитектуру движка. Иначе – хаос.
Структура файлов и папок дочерней темы
Минимальный набор: style.css
, functions.php
. Этого достаточно, чтобы система распознала каталог как отдельную тему и подгрузила стили и функции.
style.css
– обязательный файл с метаинформацией в шапке. Пример заголовка:
/*
Theme Name: Имя-наследника
Template: имя-родителя
*/
Без точного указания Template
система не свяжет наследника с родительской темой. Даже лишний пробел – фатален.
functions.php
– не перезаписывает родительский, а дополняет. Здесь регистрируется подгрузка стилей:
add_action( \'wp_enqueue_scripts\', function() {
wp_enqueue_style( \'parent-style\', get_template_directory_uri() . \'/style.css\' );
wp_enqueue_style( \'child-style\', get_stylesheet_uri(), [\'parent-style\'] );
});
Важно: не подключайте
style.css
через@import
. Это медленно и считается устаревшим.
screenshot.png
– миниатюра в админке. Размер строго 1200×900 пикселей. Никаких SVG. Один файл – одно изображение.
Дополнительные файлы берутся по необходимости. Например:
header.php
,footer.php
– переопределяют родительские шаблоны. Их наличие отключает одноимённые блоки выше по иерархии.style-override.css
илиcustom.js
– подключаются черезfunctions.php
вручную. Автоматически ничего не произойдёт.
Внимание! Любой шаблон из каталога наследника заменяет родительский при совпадении имени. Даже если внутри ничего не написано.
Нестандартные директории (типа assets
, inc
, partials
) не обрабатываются ядром. Только если вы сами пропишете обработку или маршруты к ним.
Иерархия чёткая. Ошибка в структуре – и весь проект встанет. Никаких файлов вне каталога наследника. Никаких точек в названиях. Только нижние подчёркивания или дефисы.
Никаких WYSIWYG. Только текст, код и строгая логика. Всё остальное – мусор.
Создание файла style.css с обязательными комментариями
Сразу создайте пустой файл style.css
в корневом каталоге вашего кастомного оформления. Без этого файл интерфейс не подключится. Без шансов.
Верхняя часть должна содержать строго определённые директивы. WordPress не импровизирует. Ни строчкой. Пример:
/*
Theme Name: my-child
Template: twentytwentyfour
Version: 1.0
*/
Theme Name
– произвольное имя. Показывается в админке. Template
– обязательный параметр. Точное название каталога родительского шаблона. Ошибка в одной букве – и тема не загрузится. Пиши точно. Без сокращений. Без фантазий.
Важно помнить: файл style.css
в этом контексте – это не просто таблица стилей. Это паспорт. Без него WordPress не идентифицирует структуру. Проверяется всё, включая отступы и регистр. Строгость. Безжалостность. Бездушие движка.
Внимание! Параметр
Template
должен соответствовать имени каталога родительского оформления, а не его заголовку!
Добавлять комментарии внутри основного блока – нельзя. Только после него. Только за пределами служебной области. Иначе нарушите формат, WordPress проигнорирует всю секцию.
Допустимая минимальная конфигурация:
/*
Theme Name: my-child
Template: twentytwentyfour
*/
Никаких пробелов между звёздочкой и параметром. Никаких табов. Чистота – залог распознавания. Даже комментарий – код.
Важно! Никогда не копируйте хедер из чужого проекта без проверки. Часто встречаются неверные значения Template. Внешне – всё нормально, по факту – белый экран.
Нужен дополнительный стиль? Дописывай ниже. Основной блок трогать нельзя. Пример:
body {
background: #f7f7f7;
}
Вот и всё. Без этого файла – дальше не продвинешься. Это не рекомендация. Это требование платформы.
Подключение стилей родительской темы через functions.php
В functions.php
дочерней оболочки напиши:
add_action( \'wp_enqueue_scripts\', \'enqueue_parent_styles\' );
function enqueue_parent_styles() {
wp_enqueue_style( \'parent-style\', get_template_directory_uri() . \'/style.css\' );
}
И всё? Нет. Если у базового шаблона есть дополнительные стили (например, style-rtl.css
, custom.css
или он использует @import
внутри style.css
), они не загрузятся автоматически. Проверь исходники вручную.
Важно помнить:
get_template_directory_uri()
указывает на оригинальный шаблон,get_stylesheet_directory_uri()
– на переопределяющий. Не перепутай.
Если используется style.css
дочернего оформления – добавь зависимость:
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() . \'/style.css\' );
wp_enqueue_style( \'child-style\', get_stylesheet_uri(), array( \'parent-style\' ) );
}
Без array( \'parent-style\' )
порядок может сломаться. Да, это влияет на переопределения. Порядок – всё.
Внимание! Если родитель использует
wp_enqueue_style
с хендлером, отличным отparent-style
, – узнай его точное имя и используй его как зависимость.
Пример: если исходник регистрирует стили так:
wp_enqueue_style( \'main-style\', get_template_directory_uri() . \'/style.css\' );
То и тебе нужно:
wp_enqueue_style( \'child-style\', get_stylesheet_uri(), array( \'main-style\' ) );
Пропустишь – будет каша. Стили загрузятся раньше нужного. Или вообще не загрузятся.
Смотри исходный код functions.php
родителя. Это не рекомендация. Это необходимость.
Переопределение шаблонов и добавление пользовательского кода
Файл functions.php
загружается автоматически и первый получает контроль. Добавляйте туда фильтры, экшены, отключайте ненужные скрипты:
remove_action(\'wp_head\', \'wp_generator\');
add_filter(\'excerpt_length\', function() { return 20; });
Не пишите туда HTML. Никогда. Только PHP, только код управления.
Хотите свои шаблоны для конкретных страниц? Используйте именование: page-about.php
, single-product.php
. Структура берёт своё начало от самого специфичного к универсальному. Нарушите порядок – получите не то, чего ждали.
Важно помнить: если файл не распознан, значит имя неверное или вы нарушили иерархию шаблонов.
Для кастомных страниц – создайте файл, добавьте заголовок шаблона:
<?php
/* Template Name: Моя страница */
get_header();
// контент
get_footer();
Выбор шаблона – через атрибут в админке. Быстро. Чётко. Управляемо.
Добавляйте свои скрипты через wp_enqueue_script
только в нужное время. Не в header.php
, не в футере вручную. Используйте хук wp_enqueue_scripts
:
add_action(\'wp_enqueue_scripts\', function() {
wp_enqueue_script(\'my-js\', get_stylesheet_directory_uri() . \'/js/custom.js\', [], false, true);
});
Внимание! Если подключать скрипты неправильно – получите конфликты, баги, обвал верстки. Тестируйте на каждом этапе.
Переопределяйте только то, что действительно нужно менять. Не трогайте то, что работает. Не дублируйте шаблоны без необходимости. Каждый лишний файл – потенциальная точка отказа.