Взаимодействие с настройщиком тем WordPress

В первой части серии статей по настройке тем WordPress я упоминал, что для взаимодействия с настройщиком тем вам необходимо загрузить объект $ wp_customize, который является экземпляром класса WP_Customize_Manager. Для этого вы должны использовать хук действия customize_register :

add_action( 'customize_register', 'my_theme_customize_register' );
function my_theme_customize_register( $wp_customize) {
    // Interacting with $wp_customize object
}

Вы можете разместить этот код в functions.php вашей темы или в файле, который включен в нее.

Добавление или удаление элементов настройщика тем (разделы, настройки и элементы управления)

После того, как вы загрузили объект $ wp_customize, вы можете использовать любой из его методов для добавления, получения или удаления настроек, элементов управления и разделов в нем (add_setting, get_setting, remove_setting, add_control… вы поняли).

Итак, если вы хотите получить или удалить раздел, элемент управления или параметр, все, что вам нужно, это его идентификатор. Эта строка удалит раздел цветов (поместите его в функцию my_theme_customize_register из первого фрагмента кода):

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

1. Цель этой серии статей не совсем в этом, мы создадим шаблон настройщика тем, который вы можете вместо этого просто добавить в свою тему.
2. Алекс Мэнсфилд уже рассказал об этом в своем учебнике по настройке тем из 6000 слов, который должен прочитать каждый разработчик тем WordPress, а затем написать в Твиттере (серьезно, если вы еще этого не сделали, прочтите его сейчас).

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

• Новый раздел под названием «Макет».
• Новый параметр, в котором хранится макет вашей темы
• Новое радиоуправление с двумя вариантами – боковая панель слева и боковая панель справа

Первое, что нужно добавить в настройщик тем, – это раздел «Макет»:

Пока не пытайтесь увидеть его в настройщике, раздел не будет отображаться, если в него не добавлен параметр и элемент управления. Итак, добавим оба:

Предполагая, что вы читали учебник Алекса и / или страницы Кодекса, в массиве аргументов add_setting есть только один параметр – «тип», на котором я хотел бы сосредоточиться. Здесь у вас есть две возможности: option и theme_mod, и вы можете получить их, используя get_option и get_theme_mod соответственно. Я всегда использую ‘option' просто потому, что он позволяет вам сериализовать значения настроек вашей темы, давая им такие идентификаторы, как my_theme_settings [setting_1], my_theme_settings [setting_2] и т.д. Таким образом, все значения будут сохранены как одна запись базы данных в вашей таблице wp_options.

И, наконец, после того, как вы добавили эти два фрагмента кода для работы, которую вы подключили к хуку действия customize_register (первый фрагмент кода в этом посте), настройщик темы был настроен:

В настройщик тем добавлен новый раздел

Использование значений настроек настройщика тем в вашей теме

После того, как вы предоставили своим пользователям возможность сохранять этот параметр, вы можете получить его значение, подключиться к хуку фильтра body_class и добавить его в массив существующих классов тела:

add_filter( 'body_class', 'my_theme_body_classes' );
function my_theme_body_classes( $classes) {
    /*
     * Since we used 'option' in add_setting arguments array
     * we retrieve the value by using get_option function
     */
    $my_theme_settings = get_option( 'my_theme_settings' );   
    $classes[] = $my_theme_settings['layout_setting'];
    return $classes;
}

Это добавит .left-sidebar или .right-sidebar к массиву классов тела в вашей теме. Используя эти два класса в файле style.css вашей темы, вы сможете создать два разных макета. Например:

/* Sidebar on the right is default layout */
#content {
    float: left;
    width: 60%;
}
#sidebar {
    float: right;
    width: 30%;
}
/* Using .left-sidebar class to override default layout */
.left-sidebar #content {
    float: right;
}
.left-sidebar #sidebar {
    float: left;
}

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

Резюме и дополнительная литература

TL; DR версия этого сообщения будет выглядеть примерно так: вы можете получить объект $ wp_customize, а затем либо добавить что-то (раздел, настройку или элемент управления) к нему, либо удалить из него. Все остальное сводится к параметрам настроек.

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

Источник записи: https://www.wpexplorer.com