Учебник по созданию дочерней темы WordPress

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

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

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

Примечание . Чтобы внести простые изменения CSS на свой веб-сайт, вы можете использовать поле Additional CSS, добавленное в WordPress 4.7, вместо создания дочерней темы. Эти изменения, внесенные в поле « Дополнительный CSS» , останутся там, даже если вы обновите тему. Но если вы ищете другие дополнительные изменения, такие как редактирование файлов PHP, необходимо создать дочернюю тему.

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

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

В этом уроке мы покажем, как создать дочернюю тему для нашей популярной темы Spacious .

Шаг первый:

Создайте новую папку в каталоге тем. Вы можете сделать это с помощью cPanel или через FTP. Каталог тем - это файл wp-content / themes. Итак, назовем папку «Просторная-дочерняя». Вы можете назвать его как хотите, но помните, что в имени папки не должно быть пробелов. Это распространенный подход - называть дочернюю тему родительской и добавлять в конце -child .

Шаг второй:

Внутри дочерней папки создайте файл с именем style.css и заполните информацию, как показано ниже.

/*
Theme Name: Spacious Child Theme
Theme URI: http://themegrill.com/themes/spacious/
Description: Spacious Child Theme
Author: ThemeGrill
Author URI: http://themegrill.com
Template: spacious
Version: 1.0
*/

/* =Theme customization starts here
------------------------------------------------------- */

Добавьте это и сохраните файл.

Что следует помнить :

• Имя шаблона (в данном случае просторное) должно соответствовать имени папки родительской темы, а также убедитесь, что после имени нет пустого места.
• Остальные детали могут быть добавлены или изменены по желанию.

Шаг третий:

Создайте файл с именем functions.php, как вы создали style.css на втором шаге. И заполните информацию, как показано ниже.

<?php
/**
 * Child theme functions file.
 */
function spacious_child_enqueue_styles() {
	// Parent theme style handle 'spacious_style'.
	$parent_;

	// Enqueue parent and child theme style.css.
	wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
	wp_enqueue_style( 'spacious_child_style', get_stylesheet_directory_uri() . '/style.css', array( $parent_style ), wp_get_theme()->( 'Version' ) );
}

add_action( 'wp_enqueue_scripts', 'spacious_child_enqueue_styles' );

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

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

Изменение CSS вашей темы

Если вы хотите изменить CSS темы, вы можете добавить CSS в конец файла style.css и сохранить его. Эти строки CSS перезапишут CSS родительской темы.

Например, предположим, что мы хотим изменить размер шрифта заголовка сайта для просторной темы 36px значением по умолчанию 42px на 42px а также изменить его цвет с #444444 умолчанию на синий ( #0000FF ). Затем вы можете просто добавить следующие строки CSS.

/*
Theme Name: Spacious Child Theme
Theme URI: http://themegrill.com/themes/spacious/
Description: Spacious Child Theme
Author: ThemeGrill
Author URI: http://themegrill.com
Template: spacious
Version: 1.0
*/

/* =Theme customization starts here
------------------------------------------------------- */
#site-title a {
	color: #0000FF;
	font-size: 42px;
}

Внесение дальнейших изменений

Редактирование других файлов темы
Вы также можете внести структурные изменения в файлы темы, настроив файлы шаблонов. Скажем, вы хотите изменить или добавить дополнительный код в заголовок. Затем вы можете скопировать файл header.php родительской темы, вставить в дочернюю тему и внести / добавить туда изменения и сохранить файл. Этот файл header.php загрузится вместо файла header.php родительской темы.

Заключение

Надеюсь, теперь у вас есть возможность создать дочернюю тему и произвести настройку, которая вам нравится. Хотите что-то сказать? Добавьте это в комментарии, и я вернусь к вам. Наслаждаться!