Главная Новости

Кастомизация темы WordPress c использованием дочерней темы

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

видео Кастомизация темы WordPress c использованием дочерней темы

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

Доброго утра, уважаемым читателям. Рано или поздно, многие задаются вопросами кастомизации WordPress тем . Один из безопасных способов, это создание и использование так называемых дочерних тем WordPress или  Child Theme . Что это и как работает? Давайте разбираться.



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


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

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

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

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


Дочерняя тема в #WordPress

Что потребуется для создания дочерней темы?

Прежде чем мы приступим к редактированию файлов темы, вам необходимо будет  произвести некоторые приготовления. Во-первых, вам понадобится FTP-доступ к вашему WordPress сайту или что-то типа MAMP (Wamp Serwer или Денвер) для запуска WordPress на локальной машине. Без «живого» WordPress сайта, вы не сможете увидеть, как изменился сайт. Далее вам понадобится редактор исходного кода (текстовый редактор). И наконец, родительская тема, например, Twenty Twelve — дефолтная тема WordPress, как в нашем  примере.

Шаг 1. Создание дочерней темы.

Все, что нужно, чтоб создать дочернюю WordPress тему – это одна папка и один файл. Запускаем FTP-клиент , настраиваем связь с хостингом и открываем — /wp-content/themes/. Как вы могли заметить, здесь лежат папки со всеми установленными вами темами. Создаем новую папку и называем ее «twentytwelve-child» или «parenttheme-child». Открываем только что созданную папку, внутри нее создаем CSS-файл с названием style.css. Открываем этот единственный обязательный для дочерней темы файл и добавляем следующую информацию:

/*

Theme Name: Twenty Twelve Child

Theme URI: http://example.com/

Description: Child theme for the Twenty Twelve theme

Author: Your name here

Author URI: http://example.com/about/

Template: Folder name of the parent theme

Version: 0.1.0

*/

После завершения этого шага, дочерняя тема должна заработать.

Шаг 2. Импорт CSS-файла родительской темы.

Теперь, когда необходимая папка и файл созданы, можно импортировать CSS-файл родительской темы.  Для этого добавляем в созданный в предыдущем шаге файл строку:

@import url(“../parenttheme/style.css”);

В нашем случае строка будет выглядеть так:

@import url(«../twentyten/style.css»);

Эта команда «скажет» дочерней теме, что она должна наследовать все свойства и  параметры, записанные в css-файле родительской WordPress темы.

Шаг 3. Активация дочерней темы.

Чтобы активировать созданную тему, нужно войти в административную панель WordPress сайта, перейти Внешний вид->Темы. Если все предыдущие шаги проделаны правильно, то в списке доступных тем, вы увидите вашу дочернюю тему. Чтоб использовать ее, просто нажмите «Активировать». Если вы откроете ваш сайт сейчас, то  не увидите никаких изменений, потому что мы еще не вносили никаких изменений.

Шаг 4. Настройка дочерней темы.

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

Начните вносить изменения в css-файла дочерней темы, и вы увидите, как меняется внешний вид сайта.

Шаг 5. Использование файла  functions.php

Если вы хотите  отредактировать или добавить PHP- функции с помощью дочерней темы, то вам необходимо создать файл  functions.php в папке  дочерней темы. Файл functions.php  дочерней темы загружается позже файла функций родительской темы. Если вы вносите изменения прямо в файл functions.php родительской темы, то после каждого ее обновления, вам придется вносить те же изменения вновь. Эту проблему можно решить с помощью файла  functions.php,  созданного в папке дочерней темы.

Шаг 6. редактирование PHP-файлов.

PHP- файлы изменяются по той же схеме, которую мы использовали, редактируя css-файлы. Некоторые файлы дочерней темы перекрывают одноименные файлы родительской темы в автоматическом режиме. Например, если вы хотите отредактировать файл header.php, просто создайте новый header.php в папке дочерней темы и внесите туда желаемые изменения, новый  header.php будет подключаться автоматически, вместо аналогичного файла родительской темы.

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

Шаг 7. Отмена изменений.

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

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

rss