Создание полей для ввода метаданных (мета-боксы)

Что такое мета-боксы?

Когда пользователь редактирует свою запись, меню редактирования состоит из нескольких частей по умолчанию: редактор, публикации, рубрики, теги, и т.д. Эти разделы являются мета-боксами. Плагины могут добавлять пользовательские мета-боксы к экранам редактирования любых типов записей, таких как записи, страницы, пользовательские типы записей и другие. Содержание пользовательских мета-боксов это как правило, HTML элементы формы, где пользователь вводит данные, относящиеся к цели плагина, но содержанием может быть практически любой HTML.

Зачем использовать мета-боксы?

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

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

Как мне создать мета-боксы?

Создание мета-бокса для вашего плагина включает три основных элемента: вывод элементов HTML-форм, сохранение любых значений, которые были введены, и получение этих значений. После того, как эти три элемента будут решены, вы просто делаете хук к экшену add_meta_boxes и делаете вызов к add_meta_box()

Также показано в этом примере добавление мета-бокса на экран редактирования нескольких типов записей.

Форма

Фактические элементы HTML-форм, метки и любой другой связанный HTML — выводятся из содержания callback-функции которую вы определяете. Имя функции передается в add_meta_box() функцию в качестве колбек параметра. Вот простая колбек-функция, которая сформировала пример мета-бокса, как показано выше. Обратите внимание, нет кнопки отправки в этом примере. Любые элементы форм мета-бокса включены внутри тегов формы экрана редактирования, так любые данные, введенные пользователем, размещаются вместе со всей другой информацией записи, когда пользователь нажимает на кнопку Опубликовать или Сохранить на экране редактирования. Данный фрагмент кода имеет логический изъян, который будет объяснен позже в части Получение значений, но он правильно выводит элементы формы по умолчанию.

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

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

Сохранение значений

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

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

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

Получение значений

Наконец, редко есть польза от сохранения данных, если мы не получим и не используем их. Вы просто получаете значения с того места, где Вы сохранили их изначально. Если они хранились в таблице postmeta, вы можете получить данные с помощью get_post_meta(). Одно место, где вы наверняка захотите извлечь данные и отображать их — когда выводится содержимое мета-бокса. Таким образом, поля формы могут быть предварительно заполнены текущими сохраненными значениями. Первоначальная колбек-функция показанная выше в подразделе Форма имела логический недостаток, там отображается элемент формы по умолчанию, даже если в настоящее время существуют сохраненные значения. Исправленное выпадающее поле с заранее заданным значением:

За кулисами

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

Когда экран настройки записи хочет отобразить все мета-боксы, которые были добавлены к нему, он просто вызывает do_meta_boxes(). Эта функция просматривает каждый добавленный мета-бокс колбек, который в свою очередь, выводит все содержание мета-бокса. Между каждым вызовом промежуточные дивы, заголовки и т.д. также выводятся в случае необходимости.

Варианты

Наиболее распространенный, процедурный метод реализации мета-бокса был проиллюстрирован выше. Многие разработчики плагинов могут иметь необходимость реализации мета-боксов по-разному.

Классы

Добавление мета-бокса изнутри объекта класса включает в себя несколько различных подходов, хотя основная концепция не меняется. Добавление мета-бокс, генерация формы и функциональность поля сохранения значения определяются как методы класса. Эти методы добавляются к экшен-хуку с помощью __construct() метод класса, где add_action() колбеки передаются с помощью обычного формата метода класса: add_action( ‘action_tag’, array( $this, ‘method_name’) ). Наконец, создается экземпляр класса с помощью обычной new class_name(); конструкции в колбек-функции к “load-{$page_hook}” экшену. Для мета-бокса записи, $page_hook будет одинаков как для ‘post.php’ так и для ‘post-new.php’. Оба экшена должны быть подключены. Ниже эквивалентный код PHP для создания мета-бокса из примера выше с помощью объекта класса.

Заметили ли вы, обычные имена методов? Приятной особенностью использования классов в плагинах является то, что вы можете использовать общие, логические свойства и имена методов без заботы о конфликтах имен, встречающихся в процедурном кодировании.

AJAX

Поведение мета-бокса по умолчанию — для отправки данных формы вместе со всеми другими элементами формы на экране редактирования записи. Во многих случаях более быстрое реагирование на действия пользователя не требуется. В таких случаях вы можете предоставить ссылку или графическую кнопку в пределах мета-бокса для пользователя, чтобы он мог нажать кнопку. В нашем примере бокса выбора варианта, событие может быть «изменить«. Когда происходит клик или событие «изменения», может быть сделан AJAX запрос и содержимое экрана может немедленно обновляться, чтобы отразить ответа сервера.

Вот пример jQuery скрипта на стороне клиента, который делает AJAX запрос, когда выбираемая опция изменяется, а затем заполняет внутренний HTML элемента с идентификатором «myother_field» ответом сервера. «myother_field» элемент предположительно в другом месте на экране, а не в мета-боксе для этого конкретного примера, таким образом, связанный HTML не будет найден здесь.

Вот скрипт PHP на стороне сервера, что ставит в очередь вышеупомянутый jQuery скрипт на экране редактирования записи. Наш скрипт в файле с именем myjquery.js находящегося в /js/ папке внутри папки плагина.

Обратите внимание, что мы локализовали URL в admin-ajax.php вместо глобального ajaxurl. Некоторые разработчики предпочитают этот подход, потому что ajaxurl не доступен для скриптов фронтенда. Локализованная версия доступна во всех контекстах. И, наконец, вот PHP код, который на самом деле обрабатывает запрос AJAX. В этом случае, выбранный текст в опции используется в качестве ключа массива, чтобы получить значение из массива, хранящегося в таблице опций. Затем отправляется в браузер, как ответ.

В качестве последнего напоминания — это простой пример кода в котором пропущены важные операции безопасности, возможностей, обработки и т.д. Включайте такие операции на продакшене. Читайте более в Кодексе о AJAX.

Удаление Мета-боксов

Вы можете столкнуться с необходимость удаления существующего мета-бокса с экрана редактирования. Используйте remove_meta_box(), для этого. Передаваемые параметры должны соответствовать тем, которые использовались при добавлении мета-бокса. Чтобы удалить мета-боксы по умолчанию, проверьте исходный код и правильные параметры для использования. По умолчанию add_meta_box() вызовы сделаны из wp-includes/edit-form-advanced.php

Дополнительная информация (англ.)

Навигация по разделам:

Оставить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *