как создать дочернюю тему вордпресс

By /

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

1. Подготовка

1.1. Убедитесь, что у вас есть доступ к админке WordPress и файловой системе сайта.

  • Вы можете работать через FTP или через файловый менеджер в панели хостинга.

1.2. Определите родительскую тему.

  • Прежде чем создавать дочернюю тему, убедитесь, что у вас есть установленная родительская тема, на основе которой будет строиться дочерняя. Обычно дочерняя тема создается на основе популярной темы, такой как Twenty Twenty-One, Astra, GeneratePress и т.д.

2. Создание папки для дочерней темы

2.1. Папка дочерней темы

  • Перейдите в директорию с темами WordPress: wp-content/themes/

  • Создайте новую папку для дочерней темы. Название папки должно быть уникальным, обычно это название родительской темы с добавлением суффикса _child. Например, для темы twentytwentyone папка будет называться twentytwentyone-child.

2.2. Структура папки дочерней темы

В папке дочерней темы нужно создать следующие основные файлы:

  • style.css

  • functions.php

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

3. Создание файла style.css

Файл style.css содержит мета-информацию о дочерней теме, включая ссылку на родительскую тему. Это обязательный файл.

Пример содержимого файла style.css для дочерней темы:

css
/*
Theme Name:   Twenty Twenty-One Child
Theme URI:    https://example.com/twenty-twenty-one-child
Description:  Дочерняя тема для Twenty Twenty-One.
Author:       Ваше Имя
Author URI:   https://example.com
Template:     twentytwentyone  /* Здесь указываем название папки родительской темы */
Version:      1.0.0
*/

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

Обратите внимание на строку Template: twentytwentyone, которая указывает на родительскую тему. Название папки родительской темы должно быть указано точно.

Важно: Если ваша версия WordPress 5.0 и выше, рекомендуется использовать другой способ подключения стилей, с помощью wp_enqueue_scripts, так как использование @import устарело.

4. Подключение стилей родительской темы через functions.php

Создадим файл functions.php в папке дочерней темы, чтобы подключить стили родительской темы.

Пример содержимого файла functions.php:

php
<?php
// Подключение стилей родительской темы
function my_theme_enqueue_styles() {
    // Подключаем стили родительской темы
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
    // Подключаем стили дочерней темы
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array('parent-style') // Указываем, что стили дочерней темы должны быть загружены после стилей родительской
    );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );

5. Внесение изменений в шаблоны

5.1. Копирование файлов шаблонов

Если вы хотите изменить какой-то файл шаблона родительской темы, например, header.php или footer.php, нужно скопировать этот файл из родительской темы в папку дочерней. После этого вы можете редактировать его.

Пример:

  • Копируйте файл header.php из папки родительской темы.

  • Вставьте его в папку дочерней темы.

  • Теперь вы можете редактировать header.php в дочерней теме, и изменения будут применяться.

5.2. Изменения через хуки и фильтры

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

Пример добавления дополнительного элемента в заголовок:

php
add_action( 'wp_head', 'my_custom_head_code' );
function my_custom_head_code() {
    echo '<meta name="author" content="Ваше Имя">';
}

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

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

  1. Перейдите в админку WordPress.

  2. Откройте раздел Внешний вид → Темы.

  3. Найдите свою дочернюю тему и нажмите Активировать.

7. Проверка

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

8. Дополнительные изменения

Вы можете добавлять дополнительные функции или стили в дочернюю тему, как вам угодно. Например:

  • Добавление новых стилей: Вы можете добавлять кастомные стили в файл style.css дочерней темы.

  • Добавление новых функций: В functions.php дочерней темы можно добавлять функции для изменения функционала сайта.

  • Создание кастомных шаблонов: Если вам нужно изменить отдельные страницы или разделы сайта, создайте кастомные шаблоны в дочерней теме (например, single.php, page.php, archive.php).

9. Обновления и безопасность

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

Вот и все! Теперь у вас есть полноценная дочерняя тема, с которой вы можете безопасно работать и вносить изменения.

Scroll to Top

Карта сайта