Как добавить настройки в админ-панель WordPress: пошаговое руководство с примерами кода

Автор: Нина Журавлева | Опубликовано: 27.11.2025

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

Что такое Settings API и почему его стоит использовать

Settings API — это набор функций и методов в WordPress, который позволяет программистам создавать страницы настроек, разделы и поля ввода без необходимости вручную писать HTML и обрабатывать данные. Такой подход обеспечивает безопасность, удобство и совместимость с ядром WordPress, а также с другими плагинами.

Использование Settings API гарантирует, что введённые пользователем данные будут корректно сохранены, проверены и защищены от уязвимостей, таких как XSS или CSRF.

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

Создание страницы настроек в админ-панели WordPress (ключевые шаги)

Для начала нам нужно зарегистрировать страницу настроек и добавить её в меню админки. Делается это с помощью функций add_options_page и register_setting.

Пример добавления страницы в меню и регистрации настроек:

add_action('admin_menu', 'wpzoom_add_admin_menu');
add_action('admin_init', 'wpzoom_settings_init');

function wpzoom_add_admin_menu() {
    add_options_page(
        'Настройки WPZoom',
        'WPZoom Настройки',
        'manage_options',
        'wpzoom_settings',
        'wpzoom_options_page'
    );
}

function wpzoom_settings_init() {
    register_setting('wpzoom_settings_group', 'wpzoom_settings');

    add_settings_section(
        'wpzoom_section',
        'Основные настройки',
        'wpzoom_settings_section_callback',
        'wpzoom_settings'
    );

    add_settings_field(
        'wpzoom_text_field',
        'Текстовое поле',
        'wpzoom_text_field_render',
        'wpzoom_settings',
        'wpzoom_section'
    );
}

В этом примере мы добавляем страницу в меню «Настройки» и регистрируем группу настроек, секцию и поле.

Описание ключевых функций

add_options_page — добавляет страницу в меню «Настройки»;
register_setting — регистрирует группу настроек для последующего сохранения;
add_settings_section — добавляет раздел настроек на страницу;
add_settings_field — добавляет конкретное поле настройки.

Создание и отображение полей настроек

Теперь создадим функцию для отображения поля ввода текста:

function wpzoom_text_field_render() {
    $options = get_option('wpzoom_settings');
    ?>
    <input type='text' name='wpzoom_settings[wpzoom_text_field]' value='<?php echo isset($options['wpzoom_text_field']) ? esc_attr($options['wpzoom_text_field']) : ''; ?>'>
    <?php
}

function wpzoom_settings_section_callback() {
    echo '<p>Здесь вы можете настроить основные параметры плагина WPZoom.</p>';
}

В функции wpzoom_text_field_render мы выводим поле ввода, которое читает значение из опций и сохраняет его обратно при отправке формы.

Отображение страницы настроек с формой

Для вывода страницы с настройками создадим функцию:

function wpzoom_options_page() {
    ?>
    <form action='options.php' method='post'>
        <?php
        settings_fields('wpzoom_settings_group');
        do_settings_sections('wpzoom_settings');
        submit_button();
        ?>
    </form>
    <?php
}

Здесь settings_fields выводит скрытые поля безопасности, do_settings_sections — все зарегистрированные секции и поля, а submit_button — кнопку для отправки формы.

Добавление различных типов полей настроек

Кроме текстовых полей, можно создавать чекбоксы, селекты, текстовые области и даже кастомные элементы.

Пример чекбокса

add_settings_field(
    'wpzoom_checkbox_field',
    'Включить функцию',
    'wpzoom_checkbox_field_render',
    'wpzoom_settings',
    'wpzoom_section'
);

function wpzoom_checkbox_field_render() {
    $options = get_option('wpzoom_settings');
    ?>
    <input type='checkbox' name='wpzoom_settings[wpzoom_checkbox_field]' <?php checked(isset($options['wpzoom_checkbox_field']) ? $options['wpzoom_checkbox_field'] : 0, 1); ?> value='1'>
    <?php
}

Пример селекта

add_settings_field(
    'wpzoom_select_field',
    'Выберите опцию',
    'wpzoom_select_field_render',
    'wpzoom_settings',
    'wpzoom_section'
);

function wpzoom_select_field_render() {
    $options = get_option('wpzoom_settings');
    $value = isset($options['wpzoom_select_field']) ? $options['wpzoom_select_field'] : '';
    ?>
    <select name='wpzoom_settings[wpzoom_select_field]'>
        <option value='option1' <?php selected($value, 'option1'); ?>>Опция 1</option>
        <option value='option2' <?php selected($value, 'option2'); ?>>Опция 2</option>
        <option value='option3' <?php selected($value, 'option3'); ?>>Опция 3</option>
    </select>
    <?php
}

Валидация и фильтрация данных настроек

Очень важно фильтровать и валидировать данные, которые пользователь вводит в настройки, чтобы избежать ошибок и повысить безопасность.

Для этого при регистрации настроек можно передать функцию-обработчик:

register_setting('wpzoom_settings_group', 'wpzoom_settings', 'wpzoom_settings_validate');

function wpzoom_settings_validate($input) {
    $output = [];

    if(isset($input['wpzoom_text_field'])) {
        $output['wpzoom_text_field'] = sanitize_text_field($input['wpzoom_text_field']);
    }

    $output['wpzoom_checkbox_field'] = !empty($input['wpzoom_checkbox_field']) ? 1 : 0;

    $allowed = ['option1', 'option2', 'option3'];
    if(isset($input['wpzoom_select_field']) && in_array($input['wpzoom_select_field'], $allowed)) {
        $output['wpzoom_select_field'] = $input['wpzoom_select_field'];
    } else {
        $output['wpzoom_select_field'] = 'option1';
    }

    return $output;
}

Здесь мы используем встроенные в WordPress функции для очистки строк, проверяем чекбокс и валидируем выбранное значение селекта.

Полезные плагины для расширения функционала настроек

Если вы не хотите писать всё с нуля, можно использовать готовые решения, которые значительно упрощают работу с настройками:

Advanced Custom Fields (ACF) — позволяет создавать сложные поля и группы настроек с удобным интерфейсом;
Redux Framework — мощный фреймворк для создания панелей настроек с множеством опций;
Carbon Fields — современный и простой в использовании инструмент для создания метаполей и настроек.

Однако знание базового Settings API поможет лучше понимать, как устроена внутренняя логика и как можно кастомизировать решения под свои задачи.

Советы и рекомендации по работе с настройками в WordPress

Создавая настройки, всегда учитывайте удобство пользователя. Не перегружайте интерфейс избыточными полями, группируйте параметры по смыслу.

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

Обязательно тестируйте сохранение и загрузку настроек на разных версиях WordPress и с разными ролями пользователей.

И помните, что правильное именование функций и префиксов (в нашем случае — wpzoom_) помогает избежать конфликтов с другими плагинами и темами.