Добавить управление в подпанели виджетов в кастомизаторе

На чтение 3 мин Опубликовано 02.12.2024

Содержание

Вопрос или проблема
Ответ или решение
Шаги для добавления управления в подпанель виджетов
Заключение

Вопрос или проблема

Возможно ли добавить элементы управления в подпанели панели виджетов в кастомизаторе? Если да, то как к ним обращаться? Область виджетов будет называться “top-widget-area”

Ни одно из обращений:

'panel' => 'widgets-top-widget-area'

или

'section' => 'widgets-top-widget-area'

в $wp_customize->add_control не работает.

У вас есть идеи?

Оказывается, секция будет обращаться с помощью ‘section’ => ‘sidebar-widgets-top-widget-area’ … так что вам нужно добавить sidebar-widgets- перед названием области виджетов.

Однако, так как это панель виджетов, все, кроме активных областей виджетов на странице, на которой вы находитесь, установлены на display: none; и должны быть установлены на: display: block !important;

@richwp, я задал похожий вопрос и получил подробный ответ от Уэстона Рутера, который на самом деле работает над панелью кастомизатора виджетов в ядре. Он создал статью, видео и репозиторий на github с исходным кодом, чтобы ответить на мой вопрос (что было замечательным поступком). Вот ссылка на статью, которую он написал: [ссылка]https://make.xwp.co/2017/02/08/adding-meta-fields-to-a-widget-sidebar-section-in-the-customizer/

Ответ или решение

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

Шаги для добавления управления в подпанель виджетов

Идентификация секции: Первое, что нужно сделать, это правильно определить идентификатор секции, в которую вы хотите добавить элементы управления. Для области виджетов "top-widget-area" правильный идентификатор будет формата sidebar-widgets-top-widget-area.

Использование WP Customizer API: Для добавления управления в секцию используйте метод add_control в классе $wp_customize. Пример кода для этого может выглядеть следующим образом:

function my_customizer_controls( $wp_customize ) {
    // Добавляем секцию для вашего виджета
    $wp_customize->add_section( 'sidebar-widgets-top-widget-area', array(
        'title'      => __( 'Top Widget Area', 'тема' ),
        'priority'   => 30,
    ) );

    // Добавляем элементы управления
    $wp_customize->add_setting( 'my_custom_setting', array(
        'default'   => '',
        'sanitize_callback' => 'sanitize_text_field',
    ) );

    $wp_customize->add_control( 'my_custom_setting', array(
        'label'     => __( 'Мой собственный элемент управления', 'тема' ),
        'section'   => 'sidebar-widgets-top-widget-area',
        'type'      => 'text',
    ) );
}
add_action( 'customize_register', 'my_customizer_controls' );

Стилизация для отображения: Так как в настройщике WordPress комнаты для неактивных виджетов по умолчанию имеют стиль display: none, вам, возможно, придется изменить CSS-стили для ваших элементов управления. Это можно сделать с помощью встроенного кода или подключения CSS-файла. Например:
```
function my_customizer_css() {
    ?>
    <style>
        .customize-control { display: block !important; }
    </style>
    <?php
}
add_action( 'wp_footer', 'my_customizer_css' );
```
Документация и ресурсы: Вам также может быть полезно обратиться к материалам, созданным разработчиком WordPress, Уэстоном Рутером. Его статьи и репозиторий на GitHub содержат ценные ориентиры по работе с панелями виджетов в настройщике. Вы можете найти информацию по следующей ссылке: Ссылка на гитхаб.

Заключение

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

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