Дочерние темы в WordPress

Опубликовано: 01.09.2018

видео Дочерние темы в WordPress

Дочерняя тема Wordpress за 3 шага

И сразу же постараюсь ответить на вопрос из заголовка — для чего нужны дочерние темы?

Если вам когда-нибудь приходилось редактировать темы сторонних разработчиков, то вы наверняка в курсе, что после обновления темы, все сделанные изменения в файлах исчезают. Конечно, вы можете просто отключить возможность обновления тем , но использование дочерних шаблонов — более правильный вариант. Также родительскую тему можно использовать как общий шаблон для многих сайтов. Всё равно у каждого разработчика есть какой-то код, который он использует для всех своих сайтов, например некоторые хуки . Получается, что использование дочерних тем, позволяет сэкономить время.

Как создать дочернюю тему?

В качестве примера давайте возьмём стандартную тему WordPress Twenty Twelve — для неё и создадим дочернюю тему.



Первым шагом создаем директорию дочерней темы:

Я назвал её twentytwelve-child, но это совсем не обязательно — можете называть как угодно, главное, чтобы название темы не содержало пробелов и русских букв.

Следующим шагом — работа со style.css. У меня он начинается с этого:
/* Theme Name: Twenty Twelve Child Author: Миша Рудрастых Author URI: https://misha.blog Template: twentytwelve */

Самым важным в данном случае является параметр Template — он и определяет то, что эта тема дочерняя. Параметр содержит название директории родительской темы.


Дочерняя тема WordPress. Быстрое создание плагином Child Theme Configurator

На этом этапе дочерняя тема появится в админке вашего сайта.

Если вы активируете её и перейдёте на сайт, то заметите, что вместо таблицы стилей родительской темы подгружается таблица стилей дочерней темы. Если именно это вам и нужно, то можете пропустить следующий шаг.


Дочерние темы WordPress, создание и настройка

Создаём в папке с дочерней темой functions.php и добавляет туда хук, который будет подключать таблицу стилей родительской темы на сайт и сразу же за ней — таблицу стилей дочерней темы.
function true_enqueue_styles ( ) { 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' ) ) ; } add_action ( 'wp_enqueue_scripts' , 'true_enqueue_styles' ) ;

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

Также иногда бывает нужно пересохранить меню Внешний вид > Меню и настройки темы.

Как работают дочерние темы?

На самом деле всё очень и очень просто — файлы, которые вы создаёте в директории дочерней темы, будут заменять эквивалентные им файлы из родительской темы.

style.css и functions.php

Исключение составляют эти два файла.

Если вы задействовали у себя хук, о котором я писал чуть выше, то файл дочерняя таблица стилей будет загружаться в дополнение к таблице стилей родительской темы. functions.php дочерней темы всегда подключается непосредственно перед functions.php родительской темы. Что делать, если нужно задействовать функцию после инициализации functions.php родительской? Используйте хук after_setup_theme с приоритетом больше 10.

Функции

Родительская тема Дочерняя тема
get_template_directory_uri() — возвращает URL родительского шаблона. get_stylesheet_directory_uri() — возвращает URL текущего шаблона (т е, если функция используется в дочерней теме, то выведен будет URL дочерней темы).
get_template_directory() — возвращает абсолютный путь к директории родительской темы на сервере. get_stylesheet_directory() — возвращает абсолютный путь к директории текущей темы на сервере.

Локализация

Процесс перевода дочерних тем по сути ничем не отличается от локализации недочерних тем. Про локализацию читайте подробнее здесь .

Смотрите также

rss