Как создать настройку в админ панели WordPress через свой плагин

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

Что такое настройки в WordPress и зачем они нужны

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

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

Рассмотрим, как это реализовать на практике с нуля.

Регистрация страницы настроек в меню админ панели WordPress

Первый шаг — добавить новую страницу меню в админку. Для этого используем хук admin_menu и функцию add_options_page, которая добавит пункт в меню «Настройки».

add_action('admin_menu', 'wpinc_add_settings_page');

function wpinc_add_settings_page() {
    add_options_page(
        'Настройки WPINC', // Заголовок страницы
        'Настройки WPINC', // Текст меню
        'manage_options',    // Права доступа
        'wpinc-settings',    // slug страницы
        'wpinc_render_settings_page' // Функция вывода
    );
}

В данном примере создается страница с заголовком и названием в меню «Настройки WPINC». Функция wpinc_render_settings_page будет отвечать за вывод содержимого.

Вывод формы настроек на странице

Чтобы сохранить настройки, WordPress рекомендует использовать Settings API. Для начала создадим форму с использованием функций settings_fields и do_settings_sections.

function wpinc_render_settings_page() {
    ?>
    <div class="wrap">
        <h1>Настройки WPINC</h1>
        <form method="post" action="options.php">
            <?php
            settings_fields('wpinc_options_group');
            do_settings_sections('wpinc-settings');
            submit_button();
            ?>
        </form>
    </div>
    <?php
}

Здесь мы вызываем settings_fields с именем группы опций, которую зарегистрируем дальше, и do_settings_sections для вывода секций и полей.

Регистрация настроек, секций и полей с помощью Settings API

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

add_action('admin_init', 'wpinc_register_settings');

function wpinc_register_settings() {
    // Регистрируем опцию
    register_setting('wpinc_options_group', 'wpinc_options', 'wpinc_sanitize_options');

    // Добавляем секцию
    add_settings_section(
        'wpinc_main_section',
        'Основные настройки',
        'wpinc_main_section_cb',
        'wpinc-settings'
    );

    // Добавляем поле
    add_settings_field(
        'wpinc_text_field',
        'Текстовое поле',
        'wpinc_text_field_cb',
        'wpinc-settings',
        'wpinc_main_section'
    );
}

Здесь мы создаем группу настроек wpinc_options_group, регистрируем опцию wpinc_options (которая будет хранить массив с настройками), добавляем секцию и поле для ввода текста.

Обработчик секции и поля

Функция обратного вызова для секции используется для вывода описания.

function wpinc_main_section_cb() {
    echo '<p>Настройки плагина WPINC для управления поведением сайта.</p>';
}

Функция для поля выводит HTML для ввода значения. Значения берем из опций.

function wpinc_text_field_cb() {
    $options = get_option('wpinc_options');
    ?>
    <input type="text" name="wpinc_options[wpinc_text_field]" value="<?php echo isset($options['wpinc_text_field']) ? esc_attr($options['wpinc_text_field']) : ''; ?>" />
    <?php
}

Обработка и валидация данных настроек

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

function wpinc_sanitize_options($input) {
    $output = array();

    if (isset($input['wpinc_text_field'])) {
        // Очищаем текстовое поле
        $output['wpinc_text_field'] = sanitize_text_field($input['wpinc_text_field']);
    }

    return $output;
}

В этой функции мы явно очищаем каждое поле. Если в будущем добавите новые поля, следует дописать их обработку.

Пример расширения: добавление чекбокса и выпадающего списка

Рассмотрим, как добавить еще два поля — чекбокс для включения функции и выпадающий список с вариантами.

add_settings_field(
    'wpinc_checkbox_field',
    'Включить функцию',
    'wpinc_checkbox_field_cb',
    'wpinc-settings',
    'wpinc_main_section'
);

add_settings_field(
    'wpinc_select_field',
    'Выберите опцию',
    'wpinc_select_field_cb',
    'wpinc-settings',
    'wpinc_main_section'
);

function wpinc_checkbox_field_cb() {
    $options = get_option('wpinc_options');
    $checked = isset($options['wpinc_checkbox_field']) && $options['wpinc_checkbox_field'] ? 'checked' : '';
    ?>
    <input type="checkbox" name="wpinc_options[wpinc_checkbox_field]" value="1" <?php echo $checked; ?> />
    <?php
}

function wpinc_select_field_cb() {
    $options = get_option('wpinc_options');
    $value = isset($options['wpinc_select_field']) ? $options['wpinc_select_field'] : '';
    $choices = array('option1' => 'Опция 1', 'option2' => 'Опция 2', 'option3' => 'Опция 3');
    ?>
    <select name="wpinc_options[wpinc_select_field]">
        <?php foreach ($choices as $key => $label): ?>
            <option value="<?php echo esc_attr($key); ?>" <?php selected($value, $key); ?>><?php echo esc_html($label); ?></option>
        <?php endforeach; ?>
    </select>
    <?php
}

И не забудьте добавить их в функцию валидации:

function wpinc_sanitize_options($input) {
    $output = array();
    if (isset($input['wpinc_text_field'])) {
        $output['wpinc_text_field'] = sanitize_text_field($input['wpinc_text_field']);
    }
    $output['wpinc_checkbox_field'] = !empty($input['wpinc_checkbox_field']) ? 1 : 0;

    $valid_options = array('option1', 'option2', 'option3');
    if (isset($input['wpinc_select_field']) && in_array($input['wpinc_select_field'], $valid_options)) {
        $output['wpinc_select_field'] = $input['wpinc_select_field'];
    } else {
        $output['wpinc_select_field'] = 'option1'; // Значение по умолчанию
    }

    return $output;
}

Использование сохраненных настроек в коде плагина

Данные, сохраненные через нашу форму, доступны через функцию get_option('wpinc_options'). Это массив с ключами, соответствующими именам полей. Пример использования:

$options = get_option('wpinc_options');
if (!empty($options['wpinc_checkbox_field'])) {
    // Включаем дополнительную функциональность
}

Так можно гибко настраивать поведение плагина или темы без изменения кода.

Полезные плагины для расширения и упрощения работы с настройками

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

• Advanced Custom Fields (ACF) — позволяет создавать сложные поля и группы настроек с удобным интерфейсом.
• Settings API Plugin — визуальный интерфейс для создания страниц настроек на базе WordPress Settings API.
• Custom Settings Framework — облегчает работу с настройками и хранением данных.

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

Советы по безопасности и производительности

При работе с настройками всегда проверяйте права доступа (manage_options) и используйте nonce для защиты форм. Не забывайте фильтровать и экранировать данные при выводе.

Для производительности не храните большие объемы данных в опциях, лучше использовать пользовательские таблицы или transient API, если нужно временное кэширование.

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