Поднимите руку те, кто настраивал более 5 WordPress сайтов. Не опускайте руку, если вы настраивали более 10. Если же вы настроили более 20, то наверняка знаете о дочерних темах. Работа с дочерней темой — это отличный способ изменить родительскую тему WordPress. За эти годы WordPress темы стали очень разнообразными, но всё равно требуют настройки.

Предположим, что вы установили одну из стандартных тем, к примеру, TwentySixteen или TwentyFifteen. Вы настроили её стили и добавили несколько PHP функций. Но что случится, когда разработчики выпустят новую версию? У вас есть только два пути: загрузить обновления и потерять все настройки, или оставить старую версию и сделать сайт уязвимым.

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

Лучшим вариантом будет создание дочерней темы для настройки любой темы.

В этой статье мы расскажем о том, как правильно создавать дочерние темы в WordPress и поделимся кодом _child шаблона. Итак, давайте сначала узнаем побольше о концепции и важности дочерних тем в WordPress.

Что такое дочерние темы?

Принцип работы дочерних тем базируется на родительско-дочерних отношениях. Все темы WordPress, неважно платные или бесплатные, являются родительскими темами. А все дочерние темы перенимают свои характеристики у родительских. То есть, дочерняя тема получит весь набор функций от родительской темы.

Согласно с WordPress Codex:

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

Если выходят обновления родительской темы, то дочерняя тема не меняется. Измениться может только родительский контент, а настройки дочерней темы остаются такими же.

Отличия дочерней темы от родительской

Таким образом, сохранить изменения и наслаждаться обновлениями можно только в дочерней теме. Позже в этой статье мы также обсудим методы создания дочерней темы.

Ну а сейчас давайте рассмотрим отличия дочерней и родительской темы:

  • Дочерняя тема работает только, если установлены обе темы – родительская и дочерняя. Хотя вы и активируете дочернюю тему позже.
  • Дочерняя тема имеет связь исключительно со своей родительской темой, ни у какой другой родительской темы нет связи с чужой дочерней темой.
  • Любые изменения в родительской теме никак не влияют на дочернюю.

Преимущества использования дочерней темы

Сама концепция дочерней темы — отличная. Мы предлагаем использовать дочерние темы со всеми премиум темами, а профессиональным разработчикам стоит включить их в пакет со своими темами.

У дочерних тем есть масса преимуществ:

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

Компоненты дочерней темы

Дочерняя тема является продолжением родительской темы, перенимая все функции и особенности. Как и обещали, вот основной состав дочерней темы:

  • Директория дочерней темы: Это корень папки, где находятся файлы дочерней темы.
  • Файл style.css: В этом файле содержатся все свойства стилей вашей дочерней темы.
  • Файл functions.php: Содержит определение функций, которые вызваны в вашей дочерней теме.

Вы можете добавить любое количество шаблонных файлов, но вышеперечисленные файлы должны быть в каждой дочерней теме.

Создание дочерней темы в WordPress

Вы уже знаете о нескольких функциях и аспектах дочерних тем WordPress. Вы выяснили, для чего они нужны, а теперь пора обсудить их название. Простейшим способом создания дочерней темы будет использование плагина. В библиотеке WordPress.org вы можете найти огромное количество бесплатных плагинов, которые упрощают создание дочерней темы.

1. Child Theme Configurator

Плагин Child Theme Configurator создаёт дочерние темы за пару кликов. С его мощным CSS редактором вы можете настроить расширенный уровень функциональности. Плагин не только идентифицирует, но и меняет нужные атрибуты CSS.

2. Child Themify

Для создания дочерних тем мы можем также порекомендовать плагин Child Themify. Он очень лёгкий и создаёт дочернюю тему всего лишь нажатием кнопки.

3. _child Theme Boilerplate

Если вы разработчик, то вам наверняка будет интересно оценить готовый шаблон для дочерней темы. Он называется _child и был создан для оптимизации процесса создания дочерней темы в WordPress.

Этот шаблон предоставляет вам интуитивную дочернюю тему, где для её создания вам нужно только вставить ссылку на родительскую тему. Шаблон _child помог нам создать профессиональную дочернюю тему. Вы можете найти этот шаблон на GitHub. А сейчас позвольте нам рассказать о двух готовых файлах в этом шаблоне.

  • style.css
  • functions.php

Файл style.css содержит стандартный хедер с информацией, которая помогает WordPress распознать его, как таблицу стилей дочерней темы. Тэги для Theme Name и Template — самые важные. Вы можете заменить тэг Template на подходящий slug родительской темы и вставить название дочерней темы.

Код для style.css:

/**
 * Theme Name: Themename Child
 * Description: Themename Child Theme
 * Theme URI: https://labs.ahmadawais.com/_child/
 * Author: mrahmadawais, WPTie
 * Author URI: http://ahmadawais.com/
 * Template: themename
 * Version: 1.0.0
 */

/* ----------------------------------------------------------------------------
 * Child Theme Style.css styles begin here!
 * ------------------------------------------------------------------------- */

В файле functions.php есть функция, которая называется aa_enqueue_styles(). Она ставит в очередь таблицы стилей сначала для родительской темы, а потом дочерней. Таким образом стиль дочерней темы всегда будет зависеть от родительской.

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

Код для functions.php:

<?php
/**
 * Child theme functions
 *
 * Functions file for child theme, enqueues parent and child stylesheets by default.
 *
 * @since 	1.0.0
 * @package aa
 */
 
// Exit if accessed directly.
if ( ! defined( 'ABSPATH' ) ) {
	exit;
}
if ( ! function_exists( 'aa_enqueue_styles' ) ) {
	// Add enqueue function to the desired action.
	add_action( 'wp_enqueue_scripts', 'aa_enqueue_styles' );
	
	/**
	 * Enqueue Styles.
	 *
	 * Enqueue parent style and child styles where parent are the dependency
	 * for child styles so that parent styles always get enqueued first.
	 *
	 * @since 1.0.0
	 */
	function aa_enqueue_styles() {
		// Parent style variable.
		$parent_style = 'parent-style';
		
		// Enqueue Parent theme's stylesheet.
		wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
		
		// Enqueue Child theme's stylesheet.
		// Setting 'parent-style' as a dependency will ensure that the child theme stylesheet loads after it.
		wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array( $parent_style ) );
	}
}

Итоги

Неважно, являетесь ли вы обычным пользователем или разработчиком. Дочерние темы – это отличный способ настроить ваши основные темы в WordPress без боязни, что все изменения слетят после выхода обновления.

Источник: wplift.com

Вам понравился материал?

Добавить комментарий

Такой e-mail уже зарегистрирован. Воспользуйтесь формой входа или введите другой.

Вы ввели некорректные логин или пароль

Извините, для комментирования необходимо войти.

16 комментариев

сначала новые
по рейтингу сначала новые по хронологии

Здравствуйте! Подскажите, а как правильно обновить тему? Вот я создал дочернюю тему, активировал ее. Чтобы обновить тему и не потерять изменения, мне нужно теперь активировать родительскую, обновить ее, а потом активировать дочернюю. Верно? Или не так?

Чтобы обновить родительскую тему, ее не нужно активировать, просто обновите ее и все. Активной может оставаться дочерняя тема при этом.

А чтобы обновиться, нужно просто заново загрузить архив с новой версией темы? В ней нет автоматического обновления.

В таком случае да, просто загрузите новый архив с темой.

Сергей

Спасибо, статья очень кстати пришлась

После создания дочерней темы. при настройке выдает:
Сайт sitename.com выполнил переадресацию слишком много раз.
как это исправить?

Здравствуйте! Узнала о дочерних темах после того, как уже сделала изменения в родительском шаблоне. Подскажите, пожалуйста, теперь если я сделаю дочернюю тему с помощью плагина Child Theme Configurator, то при обновлении Wordpress изменения в теме останутся?

При обновлении самого WordPress изменения останутся точно. Речь идет о том, чтобы изменения остались после обновления темы оформления. Для этого делается дочерняя и в нее вносятся изменения для родительской.

Анатолий

Здравствуйте! Подскажите, пожалуйста, если я уже вносил изменения в родительской теме и хочу обновить её, то какую последовательность действий мне нужно выполнить, чтобы мои изменения не потерялись при обновлении родительской темы?

Все зависит от того, какие именно изменения вы вносили. Если речь идет об измененных настройках и параметрах темы, сделанных в админке WordPress, то все эти изменения сохранятся при обновлении родительской темы. Если же вы изменяли файлы темы, дописывали свой код например в functions.php, то все эти изменения утратятся, т.к. при обновлении эти файлы будут перезаписаны новыми файлами из новой версии.

Анатолий

Вносил изменения в файлы темы, в том числе и functions.php, и style.css. Что бы вы могли посоветовать, чтобы сохранить вид сайта таким же при помощи дочерней темы, при этом потом обновив родительскую?

Так ведь дочерняя тема для того и существует, чтобы в нее добавлять свой собственный код (в functions.php и в style.css) а родительскую не трогать, а потом безболезненно обновлять в любое время родительскую тему. После обновления родительской все ваши добавки в functions.php и в style.css в дочерней теме останутся и продолжат работать для родительской.

Анатолий

То есть мне уже нельзя делать дочернюю и обновляться, если в functions и style внесены правки?

Вы можете покопировать все внесенные правки из functions и style и добавить их в дочернюю тему, а из родительской все лишнее убрать и оставить как было в оригинале. И затем обновлять родительскую.

Анатолий

Спасибо! :)

Класс! Спасибо за статью. Недавно как раз искал как создавать дочерние темы на Вордпресс