Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. WordPress Plugins

Создаем пользовательские административные страницы - Часть 4

by
Difficulty:IntermediateLength:LongLanguages:
This post is part of a series called Creating Custom WordPress Administration Pages.
Creating Custom WordPress Administration Pages, Part 3

Russian (Pусский) translation by Ellen Nelson (you can also view the original English article)

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

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

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

На ваше рассмотрение

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

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

Прежде чем мы начнем

При этом (и говоря о требованиях) осталось всего несколько моментов относительно плагина, которые нам необходимо обсудить.

В частности нам необходимо:

  • Извлечение информацию из базы данных
  • Проверить информацию
  • отобразить информацию на панели
  • отобразить информацию на фронт-энд

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

Как обычно я предполагаю, что у вас последняя версия исходного кода, и вы будете готовы продолжить данную серию, и добавить оставшиеся части к коду.

Давайте начнем с учетом сказанного.

Завершая плагин

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

Но это не так уж плохо.

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

Имея это в виду, давайте произведем выборку информации из базы данных.

Извлечение информации из базы данных

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

Мы будем использовать get_option. Для данной функции требуется только один аргумент, и это либо идентификатор (ID) либо ключ (key), который мы использовали для сохранения информации. В нашем случае это tutsplus-custom-data. Если вы хотите творчески подойти к процессу, вы можете передать функции второй факультативный аргумент, который будет возвращен, если информация не найдена.

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

Но в этой связи возникает два вопроса:

  1. Куда это идет (особенно, если мы собираемся сделать это в двух местах в плагине)?
  2. Не должны ли мы проверить эту информацию?

Мы рассмотрим первый вопрос немного позже. Давайте сначала поговорим о валидации.

Проверка (валидация) информации

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

Вы можете прочитать об этом в Кодекс, но проверка ввода часто определяется следующим образом:

Проверка (валидация) данных — это процесс обеспечения чистоты, правильности и полезности данных.

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

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

Методы валидации

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

В нашем случае, может быть достаточным просто использовать esc_attr при обработке параметров. Если мы даем пользователям возможность ввода данных любого типа HTML, мы можете использовать wp_kses.

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

Десериализации

Раннее мы создали класс конкретно для сохранения информации в базе данных. Мы назвали этот класс Serializer. Для тех, кто не помнит функции этого класса:

  • Класс определяет функцию, которая срабатывает на hook admin_post и сохраняет информацию, которая отправляется на сервер.
  • Функция проверяет, что информация является безопасной для сохранения и пользователь получает разрешение на сохранение в базе данных.
  • Функция очищает данные и записывает их в базу данных.

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

Так что создайте папку под названием shared в корневом каталоге вашего плагина,  и добавьте файл с именем class-deserializer.php.

The shared directory for our deserializer

Далее, наш код должен:

  • быть основан на принципах объектно-ориентированного программирования
  • извлекать только запрашиваемую информацию
  • проверять информацию
  • возвращать информацию тому, кто ее запрашивает

С этой целью первоначальная структура класса будет выглядеть следующим образом:

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

Обратите внимание, что в приведенном выше коде мы определили три функции. Давайте обсудим, что делает каждая из этих функций:

  • get_value  использует ключ входящего параметра, в нашем случае это tutsplus-custom-data, и возвращает занчение соответствующее ключу. В соответствии со стандартами программирования WordPress, мы должны использовать «позднее экранирование» чтобы убедиться, что мы правильно проверяем информацию. Через секунду мы увидим как это работает.

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

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

Покажем это на странице параметров

Чтобы показать это на странице параметров, нам нужно пересмотреть способ создания экземпляра Submenu_Page в файле custom-admin-settings.php. В частности, нам нужно создать десериализатор и передать его в конструктор Submenu_Page.

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

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

И тогда конструктор для Submenu_Page должен выглядеть так:

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

Таким образом вы сможете сохранить и получить свое значение на странице параметров.

Покажем это в интерфейсе

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

Это означает, что нам нужно будет сделать следующее:

  • Настроит функцию, которая будет использовать hook_content.
  • Прочитает значение, используя наш десериализатор.
  • Подготовит значение до содержимого (возможно, в его собственном элементе).

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

Для этого создайте каталог public в корневом каталоге вашего плагина и добавьте class-content-messenger.php.

The public directory with our Content Messenger

В классе нам нужно определить конструктор, который будет принимать десериализатор как зависимость. Конструктор (и необходимое свойство) должен выглядеть так:

Затем нам нужно создать функцию init, которая будет регистрировать внутреннюю функцию (которую мы назовём display) для выдачи контента вместе с новым сообщением.

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

Но сначала нам надо его подключить:

Затем мы создадим его:

Теперь мы должны быть готовы продолжить. Убедитесь, что вы ввели значение на странице параметров. Сохраните свою работу и проверьте страницу записи на вашем сайте. Это должно выглядеть примерно так:

The message displayed above the post

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

Слово о представлениях и зависимостях

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

Некоторые из этих тем включают такие вещи, как автозагрузка PHP и такие вещи, как инъекция зависимостей.  Я не говорил об этом, потому что они не входят в нашу тему, и основной темой этой серии является обучение.

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

Заключение

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

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

Как обычно, вы можете найти мои курсы и уроки на странице моего профиля, и вы можете следовать за мной в моем блоге и/или Twitter по @tommcfarlin, где я описываю различные методы разработки программного обеспечения и о том, как мы можем использовать их в WordPress.

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

Ресурсы

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.