Зачем нужна дочерняя тема?
Дочерние темы нужны для того, чтобы разработчики тем могли обновлять/улучшать свои темы, а пользователи могли обновлять темы и не терять при этом внесенные изменения.
Поэтому, если вы используете готовую тему WordPress, автор которой не бросил разработку, то не редактируйте файлы темы напрямую, а создайте дочернюю тему и изменяйте основную тему через дочернюю.
Что можно изменить в дочерней теме?
В ней можно изменить практически все, но нужно понимать что и как работает (см. ниже). Однако, чтобы изменять некоторые вещи, родительская тема должна быть создана с учетом возможных изменений. Если разработчик родительской темы, не продумывает возможные изменения, то изменить некоторые моменты будет или сложно, или невозможно.
От сюда можно сделать вывод, что родительские темы бывают хорошие и плохие. Часто, подправить нужно не много: стили, изменить подвал и другие мелочи, а это можно сделать для любой родительской темы без особых проблем.
Создание дочерней темы
Создать подтему легко! Ниже создается дочерняя к теме Twenty Twenty-One.
- Создайте каталог с любым названием в каталоге тем: wp-content/themes. Пусть twentytwentyone-child (указать свое название в начале обычно указывается как префикс название родительской темы. В данном случае twentytwentyone-)
- Создайте в каталоге twentytwentyone-child файл style.css. С содержимым (Theme name — отображаемое название темы, Template — название родительской темы):
/*
Theme Name: Моя дочерняя тема
Template: twentytwentyone
Не обязательные параметры:
Theme URI: http://example.com/
Description: Дочерняя тема для темы twentytwentyone
Author:
Author URI: http://example.com/about/
Version: 1.0
*/
/* Свои дополнительные стили */
.title{
color:black;
}- В этом же каталоге создайте файл functions.php с содержимым
<?php
/**
* twentytwentyone Theme functions and definitions.
*
* @link https://developer.wordpress.org/themes/basics/theme-functions/
*
* @package twentytwentyone
*/
add_action( 'wp_enqueue_scripts', 'twentytwentyone_child_parent_theme_enqueue_styles' );
/**
* Enqueue scripts and styles.
*/
function twentytwentyone_child_parent_theme_enqueue_styles() {
wp_enqueue_style( 'twentytwentyone-style', get_template_directory_uri() . '/style.css');
wp_enqueue_style( 'twentytwentyone-child-style',
get_stylesheet_directory_uri() . '/style.css',
[ 'twentytwentyone-style' ]
);
}
Иногда разработчики тем не пишут стили в стандартный файл style.css поэтому если после подключения родительских стилей они не появились, повнимательней посмотрите где находятся стили родительской темы и поменяйте название файла в строке подключения.
Строка подключения родительских стилей
wp_enqueue_style( 'twentytwentyone-style', get_template_directory_uri() . '/style.css');На этом все, дочерняя тема создана!
Получает URL текущей темы (дочерней если она используется или родительской). Не содержит / на конце. Учитывает SSL.
Результатом работы функции будет адрес начинающийся с http:// или https:// для SSL.
Используйте get_template_directory_uri(), чтобы получать ссылку на каталог родительской темы, даже если используется дочерняя.
Примеры
1 Демонстрация работы функции. Выведем на экран картинку из нашей темы:
<img src="<?php echo get_stylesheet_directory_uri() ?>/images/sample.png" alt="" title="" width="" height="" />Получает URL родительской темы (даже если используется дочерняя). Без слэша на конце.
Примеры
Подключение родительских стилей
function twentytwentyone_child_parent_theme_enqueue_styles() {
wp_enqueue_style( 'twentytwentyone-style', get_template_directory_uri() . '/style.css');
wp_enqueue_style( 'twentytwentyone-child-style',
get_stylesheet_directory_uri() . '/style.css',
[ 'twentytwentyone-style' ]
);
}Получает путь до папки темы — папки где находится текущий файл стилей родительской или дочерней темы. Не содержит закрывающего слэша /.
Может пригодится, когда нужно подключить файлы из дочерней темы.
Например, если в дочерней теме использовать get_template_directory(), то получится путь до папки родительской темы. А если эту функцию, то получится путь до дочерней темы. Т.е. эта функция указывает на папку, где находится текущий файл стилей темы.
Пример использования require_once, который показывает, как можно использовать функцию, когда подключаемый файл находится в папке дочерней темы.
require_once get_stylesheet_directory(). '/my_included_file.php';В отличие от style.css, файл functions.php дочерней темы не заменяет собой соответствующий файл родительской темы. Вместо этого, он загружается в дополнение к родительскому файлу functions.php. (А именно, прямо перед родительским файлом.)
Таким образом, файл functions.php дочерней темы предоставляет элегантный, надежный метод изменения функционала родительской темы. Скажем, вы хотите добавить функцию PHP к вашей теме. Быстрее всего открыть ее файл functions.php и поместить функцию туда. Но это не умный ход: при следующем обновлении вашей темы, ваша функция исчезнет. Вот правильное решение: вы создаете дочернюю тему, добавляете в нее файл functions.php, и помещаете вашу функцию туда. Функция будет делать то же самое, плюс она не будет затронута при будущих обновлениях вашей родительской темы.
СОВЕТ ДЛЯ РАЗРАБОТЧИКОВ ТЕМ. Факт, что файл functions.php дочерней темы загружается первым, означает что вы можете делать функции своей темы расширяемыми, т.е. заменяемыми посредством дочерней темы, объявляя их условно. Пример:
if (!function_exists('theme_special_nav')) {
function theme_special_nav() {
// Ваш код.
}
}В этом случае, дочерняя тема может переопределить функцию PHP родительской темы просто объявив ее снова.
Привязка/вставка файлов в вашу дочернюю тему
Когда вам нужно вставить файлы, которые находятся внутри папки вашей дочерней темы, используйте get_stylesheet_directory(). Т.к. файл стилей родительской темы заменяется файлом style.css вашей дочерней темы, который находится в корневой папке дочерней темы, get_stylesheet_directory() указывает на папку вашей дочерней темы (а не на папку родительской темы).
Вот пример использования require_once, который показывает, как можно использовать get_stylesheet_directory(), когда подключаемый файл находится в папке дочерней темы.
require_once get_stylesheet_directory(). '/my_included_file.php';Более быстрый способ проделать все то что было в разделе «Создание дочерней темы»
можно с помощью команд wp-cli
Для этого используем команду wp scaffold child-theme
wp scaffold child-theme {slug} --parent_theme={slug} [--theme_name={title}] [--author={full-name}] [--author_uri={uri}] [--theme_uri={uri}] [--activate] [--enable-network] [--force]{slug} — Машинное имя дочерней темы(по совместительству и имя каталога)
—parent_theme={slug} — машинное имя родительской темы
[—theme_name={title}] — Название вашей дочерней темы (будет прописано в style.css)
[—author={full-name}] — имя автора (будет прописано в style.css)
[—author_uri={uri}] — ссылка на сайт разработчика (будет прописано в style.css)
[—theme_uri={uri}] — ссылка на сайт вашей темы (будет прописано в style.css)
[—activate] — активировать после создания
[—enable-network] — активировать в сети мультисайт после создания
[—force]- перезаписать файлы если существуют
Пример
# Generate a 'sample-theme' child theme based on TwentySixteen
$ wp scaffold child-theme sample-theme --parent_theme=twentysixteen
Success: Created '/var/www/example.com/public_html/wp-content/themes/sample-theme'.