Настройка тем WordPress с использованием дочерней темы

12 июня 2013

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

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

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

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

Что вам понадобится

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

Что вам понадобится

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

Все, что вам нужно, чтобы создать тему-потомок — одна папка и один файл. Перейдите в папкуwp-content/themes с помощью вашего FTP клиента. Вы увидите несколько папок, которые названы соответственно установленным темам. Создайте новую папку и дайте ей соответствующее название, например twentytwelve-child или parenttheme-child.

Перейдите в папку и создайте CSS файл под названием style.css, затем добавьте в него следующую информацию, заполнив поля своими данными:

[code]/* 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 */[/code]

В завершении этого шага у вас получается рабочая дочерняя тема.

2. Импорт CSS от родительской темы

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

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

Этот код скажет вашей теме-потомку наследовать все CSS свойства и настройки, которые хранятся в CSS родительской темы.

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

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

Просто щелкните Активировать, и ваш WordPress сайт теперь будет использовать вашу дочернюю тему. Если вы посмотрите на ваш WordPress сайт, вы не увидите изменений, потому что мы пока не делали никаких изменений в нашей копии родительской темы.

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

Вот где начинается веселье! 🙂 Теперь, когда все готово, мы можем начать изменения в родительской теме. Как мы объяснили ранее, файлы темы-потомка перезапишут файлы, которые хранятся в папке родительской темы. Следовательно, мы можем создавать вариации родительской темы без редактирования файлов ядра. Вам нужно не забывать о том, что у вас всегда должна быть рабочая версия вашей родительской темы в папке с темами, а также следить за тем, чтобы ваш @import указывал на правильное место.

Начните вносить изменения в CSS и смотрите на изменения на вашем сайте.

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

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

Использование functions.php

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

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

Изменения в PHP файлах вашей родительской темы имеют тот же принцип, что редактирование CSS. Любые файлы внутри вашей темы-потомка перезапишут соответствующие файлы родительской темы. Например, если вы хотите отредактировать файлheader.php, вам нужно создать новый header.php в папке темы-потомка и внести изменения в этот файл. WordPress будет использовать этот новый header.php вместо версии из родительской темы.

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

7. Откат изменений

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

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

Источник: wpcafe.org