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

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

Как вы знаете, для того чтобы создать сайт нужно следовать определённым шагам. И одним из таких шагов является подбор темы оформления вашего сайта или блога. Тем очень много, и при выборе нужно, прежде всего, руководствоваться техническими характеристиками (валидность кода, скорость загрузки, мобильность, кросбраузерность и т.д.). А дизайн всегда можно доработать под нужды конкретного проекта.

Что такое дочерняя тема WordPress

Дочерняя тема – это тема, которая расширяет функциональные возможности родительской темы. То есть, вы выбираете тему, устанавливаете её, и у вас открывается возможность дорабатывать тему. В большинстве случаев – эти доработки сводятся к изменению дизайна (шрифты, цвета и так далее). Это поначалу. Дальше, больше – микроразметка, ссылки в комментариях и так далее.

Но, если тема регулярно обновляется, то все изменения, внесённые вами, будут сброшены к базовым настройкам.

Так вот, дочерняя тема – это 100% копия родительской темы (основной темы). Все изменения, сделанные в дочерней теме, будут отражаться и в родительской. Но при этом файлы родительской темы не будут меняться. И обновление темы будет проходить с учётом ваших изменений.

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

Для начала вы должны понять структуру построения папок на вашем сайте. То есть, создав сайт на платформе вордпресс, на сервере появится папка themes, в которой содержатся папки всех тем установленных по умолчанию и вами.

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

Шаг 1.

Подключаемся к серверу. Через ftp-соединение или через файловый менеджер хостинга, это на ваше усмотрение.

Поочерёдно открываем папки:

public_html

папка с вашим сайтом

wp-content

themes

папка родительской темы

Шаг 2.

Рядом с папкой родительской темы создаём папку дочерней темы. Название не имеет значения. В смысле, английскими символами можете присвоить любое имя.

Шаг 3.

В папке дочерней темы создаёте файл style.css. Это обязательный файл. Именно он будет отвечать за взаимодействие родительской и дочерней тем.

Настройка файла style.css дочерней темы WordPress

Файл style.css в дочерней теме должен содержать информацию о родительской теме. По ней WordPress поймет, между какими темами организовано взаимодействие.

Так же файл style.css в дочерней теме заменяет этот же файл в родительской теме. И поэтому нужно обязательно подключить стили из родительской темы.

Итак, приступим.

Шаг 1.

Откройте файл style.css (я обычно создаю этот файл на своём компьютере в редакторе Notepad++, а потом копирую его в папку дочерней темы на хостинг).

Вставьте в файл style.css вот этот код:

/*
Theme Name:   Название темы (английскими символами)
Theme URI:    url адрес темы
Description:  Описание темы
Author:       Ваше имя (как автора)
Author URI:   url вашего сайта или страницы об авторе
Template:     название родительской темы (с соблюдением регистра)
Version:      1.0.0
*/

Вот пример, как выглядит этот код в моей новой теме.

Учтите, обязательными полями к заполнению являются Theme Name и Template. Остальные поля вы заполняете на своё усмотрение.

Шаг 2.

Теперь нужно организовать импорт стилей из родительской темы. Дело в том, что как только появляется файл style.css в дочерней теме, WP не загружает этот же файл из родительской темы. И как следствие без стилей ваша тема будет выглядеть ужасно.

Для подключения стилей из родительской темы нужно прописать всего лишь одну строчку кода:

@import url("../папка родительской темы/style.css");

Как вы понимаете – это условный путь к файлу стилей в родительской теме. Вы также можете прописать полный путь (абсолютный) к файлу стилей родительской темы.

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

Но, чтобы видеть все новые изменения, необходимо открывать административную панель WordPress и активировать дочернюю тему.

Какие файлы можно хранить в папке дочерней темы

В этой папке вы можете хранить хоть все файлы родительской темы. Но, это вовсе не обязательно. Храните лишь те, с которыми вы будете работать. В которых будете делать изменения. Разберём несколько примеров.

Файл функции темы functions.php

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

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

Вот скажем, у меня в текущей теме постоянно была проблема с тем, что путались заголовки H1 и H2. Решение этой проблемы я раскрыл в этой статье. А в своей новой теме, я могу реализовать это через файл functions.php. Добавив лишь вот такой код:

add_filter('tc_site_title_tag', 'change_tag');
function change_tag() {
if (!is_single () && !is_page ())
return 'h1';
if (is_single () || is_page ())
return 'p';
}

А всё потому, что моя новая тема, полностью построена на API ключах WordPress.

Основные файлы темы (шаблона)

После активации дочерней темы в административной панели вы не сможете редактировать основные файлы темы (single.php, page.php, index.php …). Потому, что их просто там не будет.

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

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

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

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

А теперь смотрим видеоурок и можно приступать к созданию дочерних тем.

Вот и всё, дорогие друзья, простой алгоритм создания дочерних тем в WordPress закончен. Пробуйте, внедряйте, и создавайте свои темы. Только хочу обратить ваше внимание на то, что лучше всего создавать дочернюю тему сразу после установки родительской. Иначе, если вы уже ковыряли родительскую тему, то ваша дочерняя тема не будет реализована на 100%, да встать может криво.

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

На сегодня всё, до встречи в новых видеоуроках и статьях. И конечно же, если будут вопросы, пишите в комментариях, буду рад помочь. Желаю вам удачи и хорошего настроения!

С уважением, Максим Зайцев.