Как создать собственный метабокс в WordPress

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

Что такое метабокс и зачем он нужен

Метабокс — это блок интерфейса в админке WordPress, который показывается в редакторе записей, страниц или настраиваемых типах записей. Он позволяет удобно вводить и редактировать дополнительные данные, например, цену товара, рейтинг, дату события и многое другое.

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

Примером стандартного метабокса является блок «Изображение записи» или «Публикация» с кнопками публикации. Мы же создадим свой, уникальный.

Создание базового метабокса в WordPress

Для создания метабокса используется функция add_meta_box(). Она регистрирует ваш метабокс и задаёт место его отображения.

Рассмотрим простой пример регистрации метабокса, который добавит поле для ввода «Дополнительная информация» в редактор записей.

function wpsystem_add_custom_meta_box() {
    add_meta_box(
        'wpsystem_meta_box_id', // Идентификатор метабокса
        'Дополнительная информация', // Заголовок
        'wpsystem_meta_box_callback', // Функция вывода содержимого
        'post', // Тип записи
        'normal', // Контекст (место отображения)
        'high' // Приоритет
    );
}
add_action('add_meta_boxes', 'wpsystem_add_custom_meta_box');

function wpsystem_meta_box_callback($post) {
    wp_nonce_field('wpsystem_save_meta_box_data', 'wpsystem_meta_box_nonce');
    $value = get_post_meta($post->ID, '_wpsystem_custom_field', true);
    echo '<label for="wpsystem_custom_field">Введите дополнительную информацию:</label>';
    echo '<input type="text" id="wpsystem_custom_field" name="wpsystem_custom_field" value="' . esc_attr($value) . '" size="25" />';
}

В этом коде мы создаём метабокс с уникальным ID, даём ему заголовок и указываем функцию, которая будет выводить форму.

Сохранение данных из метабокса

Чтобы введённые данные сохранялись в базе, нужно привязаться к событию сохранения записи и обработать данные. Важно проверять nonce для безопасности, а также права пользователя.

function wpsystem_save_meta_box_data($post_id) {
    if (!isset($_POST['wpsystem_meta_box_nonce'])) {
        return;
    }
    if (!wp_verify_nonce($_POST['wpsystem_meta_box_nonce'], 'wpsystem_save_meta_box_data')) {
        return;
    }
    if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) {
        return;
    }
    if (!current_user_can('edit_post', $post_id)) {
        return;
    }
    if (!isset($_POST['wpsystem_custom_field'])) {
        return;
    }
    $my_data = sanitize_text_field($_POST['wpsystem_custom_field']);
    update_post_meta($post_id, '_wpsystem_custom_field', $my_data);
}
add_action('save_post', 'wpsystem_save_meta_box_data');

Этот код проверяет, что запрос пришёл от админа, что nonce валиден и пользователь имеет право редактировать запись. Затем данные очищаются и сохраняются.

Расширенные возможности: разные типы полей и стилизация

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

Например, добавим выпадающий список для выбора рейтинга:

function wpsystem_meta_box_callback($post) {
    wp_nonce_field('wpsystem_save_meta_box_data', 'wpsystem_meta_box_nonce');
    $value = get_post_meta($post->ID, '_wpsystem_rating', true);
    echo '<label for="wpsystem_rating">Рейтинг:</label>';
    echo '<select id="wpsystem_rating" name="wpsystem_rating">';
    for ($i = 1; $i <= 5; $i++) {
        $selected = ($value == $i) ? 'selected' : '';
        echo "<option value='$i' $selected>$i</option>";
    }
    echo '</select>';
}

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

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

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

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

• Advanced Custom Fields (ACF) — мощный плагин, позволяющий создавать метабоксы и поля через удобный интерфейс, включая сложные типы полей.
• Meta Box — расширяемый плагин с поддержкой многих типов полей и гибкой настройкой.
• CMB2 — лёгкий и расширяемый фреймворк для создания метабоксов с разработческим подходом.

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

Итоги и рекомендации

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

Практикуйтесь с простыми полями, а потом усложняйте интерфейс, используя JavaScript, медиазагрузчик и другие возможности. Такой подход поможет вам создавать гибкие, надёжные и удобные решения.