На этом этапе этой серии мы заложили основу для нашего плагина, определили пользовательский хук и создали постоянное сообщение, чтобы показать, как мы можем воспользоваться этим хуком.
Однако мы не реализовали различные типы сообщений, позволяли вводить данные пользователем и отображать сообщения на основе результата ввода, предоставленного пользователем.
Но прежде чем сделать это, нам нужно добавить поддержку для различных типов сообщений, интерфейс класса, который будет поддерживать каждый тип сообщений, и структуры данных, необходимые для хранения таких сообщений.
Готовы начать?
Я с нетерпением жду продолжения этого учебного пособия, но есть несколько вещей, которые мы должны рассмотреть, прежде чем вернуться к исходному коду. Убедитесь, что в вашей системе установлено следующее программное обеспечение:
- PHP 5.6.25 и MySQL 5.6.28
- Apache или Nginx
- WordPress 4.6.1
- Ваш предпочтительный IDE или редактор
И если вы ищете универсальное решение, не забудьте попробовать MAMP .
Дорога Так далеко
Как упоминалось ранее, мы находимся в середине этой серии. Если вы пропустили какое-либо из предыдущих руководств, вот что мы уже рассмотрели:
- В первом уроке мы сосредоточились на фундаменте для минимума нашего плагина и на том, что нам нужно для начала.
- Во второй части мы немного расширили плагин, добавив очень простую страницу администрирования WordPress. Мы также сделали вызов пользовательской ловушке, которую мы используем, и связали ее на стороне сервера. Мы также начали работу над нашими настройками Messenger.
И вот что мы рассмотрим в последнем уроке:
- В конце мы свяжем все вместе, увидим это в действии и сделаем финальный плагин общедоступным для загрузки.
Однако сейчас у нас есть другая работа, на которой мы должны сосредоточиться.
Вернуться к работе
Когда мы вернемся к работе (и как мы уже рассматривали в предыдущих уроках), мы будем смотреть на следующую реализацию в этой части серии:
В этом уроке мы начнем реализовывать наш Messenger с настройками, добавив поддержку сообщений об ошибках и успешных сообщениях, а также расскажем о некоторых вопросах безопасности.
В прошлой статье мы начали работать с «Настройки мессенджера», но только в том, что касается настройки функции, которая будет постоянно отображать уведомление об успехе всякий раз, когда загружается наша пользовательская страница.
В этом уроке мы добавим поддержку ошибок, предупреждений и сообщений об успехах. Мы также собираемся отображать их все на экране, чтобы мы могли понять, как будет работать мессенджер.
Кроме того, мы собираемся добавить еще одно изменение, которое добавит поддержку для отклонения уведомлений по усмотрению пользователя.
С этим как нашим планом работы, которую мы должны сделать в этом уроке, давайте начнем.
Расширение настроек Messenger
Помните, что весь смысл Настройки Messenger заключается в том, чтобы определить способ работы с пользовательскими сообщениями, пользовательскими перехватчиками и собственным API WordPress для отображения сообщений в контексте области администрирования WordPress.
Чтобы сделать это, мы собираемся расширить работу, которую мы проделали в предыдущем уроке, и продолжать развивать нашу работу оттуда.
Успешные сообщения
Так как мы начали с сообщения об успехе в предыдущем уроке, давайте продолжим. Прямо сейчас у нас есть жестко закодированный метод, который отображает один метод:
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
|
<?php
public function display_message() {
$html = «
<div class=’notice notice-success’>
<p><strong>You have successfully displayed a custom success message.</strong></p>
</div><!— .notice-success —>
«;
$allowed_html = array(
‘div’ => array(
‘class’ => array(),
),
‘p’ => array(),
);
echo wp_kses( $html, $allowed_html );
}
|
В идеале мы хотели бы представить структуру данных, которая будет поддерживать несколько сообщений, функцию, которая даст нам доступ для добавления сколь угодно большого количества сообщений, и функцию, которая позволит нам отображать все сообщения об успехе.
Сначала мы начнем с массива. Это будет приватный атрибут класса, и он будет инициализирован в конструкторе. Начальная часть Settings_Messenger теперь должна выглядеть так:
|
01
02
03
04
05
06
07
08
09
10
11
|
<?php
class Settings_Messenger {
private $success_messages;
public function __construct() {
$this->success_messages = array();
}
}
|
И, как вы можете видеть, мы точно определили то, что мы сказали, за исключением того, что мы не определили метод для добавления наших собственных сообщений, и мы не определили сообщение для отображения наших сообщений.
Итак, давайте сделаем это сейчас. Во-первых, давайте добавим метод, который позволит нам добавлять наши собственные сообщения:
|
1
2
3
4
5
|
<?php
public function add_success_message( $message ) {
$this->success_messages[] = sanitize_text_field( $message );
}
|
Обратите внимание, что мы используем sanitize_text_field для очистки данных, поступающих в массив. Вы можете сделать санитарную обработку настолько строгой или спокойной, насколько захотите. Я выбрал именно этот метод, так как он помогает понять суть, не отклоняясь от сути урока.
Теперь давайте определим метод, который позволит нам визуализировать сообщения на внешнем интерфейсе:
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
|
<?php
public function get_success_messages() {
if ( empty( $this->success_messages ) ) {
return;
}
$html = «<div class=’notice notice-success’>»;
$html .= ‘<ul>’;
foreach ( $this->success_messages as $message ) {
$html .= «<li>$message</li>»;
}
$html .= ‘</ul>’;
$html .= ‘</div><!— .notice-success —>’;
$allowed_html = array(
‘div’ => array(
‘class’ => array(),
),
‘ul’ => array(),
‘li’ => array(),
);
echo wp_kses( $html, $allowed_html );
}
|
Конечно, этот метод может быть подвергнут рефакторингу, и я коснусь этого в заключении этого поста.
А пока давайте проверим это. Попробуйте следующий код в tutsplus-custom-message.php а затем перезагрузите экран администрирования, который мы использовали на протяжении всей серии.
|
1
2
3
4
5
6
|
<?php
$messenger = new Settings_Messenger();
$messenger->init();
$messenger->add_success_message( ‘This is a test message’ );
$messenger->add_success_message( ‘This is also a test message, too.’ );
|
Чтобы все было правильно реализовано, вы должны увидеть что-то вроде этого:
К счастью, добавление следующих двух типов сообщений очень похоже на то, что мы сделали в этом разделе.
Предупреждающие сообщения
Добавление поддержки для предупреждающих сообщений будет почти таким же, как мы делали раньше; однако вместо того, чтобы называть наш массив и связанные с ним функции, имеющие отношение к успеху, мы назовем их как-то связанные с предупреждениями.
Итак, сначала добавим массив для хранения наших сообщений:
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
|
<?php
class Settings_Messenger {
private $success_messages;
private $warning_messages;
public function __construct() {
$this->success_messages = array();
$this->warning_messages = array();
}
}
|
Затем давайте добавим функции, которые позволят нам добавлять предупреждения в мессенджер:
|
1
2
3
4
5
|
<?php
public function add_warning_message( $message ) {
$this->warning_messages[] = sanitize_text_field( $message );
}
|
И, наконец, давайте добавим функцию для отображения функции при необходимости (обратите внимание, что мы используем имя класса notice-warning при создании элемента div ):
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
|
<?php
public function get_warning_messages() {
if ( empty( $this->warning_messages ) ) {
return;
}
$html = «<div class=’notice notice-warning’>»;
$html .= ‘<ul>’;
foreach ( $this->warning_messages as $message ) {
$html .= «<li>$message</li>»;
}
$html .= ‘</ul>’;
$html .= ‘</div><!— .notice-warning —>’;
$allowed_html = array(
‘div’ => array(
‘class’ => array(),
),
‘ul’ => array(),
‘li’ => array(),
);
echo wp_kses( $html, $allowed_html );
}
|
Обратите внимание, что выбор способа отображения этого набора сообщений зависит только от вас. Вы можете выбрать отображение этого в сочетании с сообщениями об успехе, или вы можете выбрать отображение этого совершенно отдельным способом.
В этом уроке я собираюсь сделать его простым и отображать только предупреждающее сообщение одновременно. Поэтому я добавлю следующую строку кода в основной файл плагина:
|
1
2
|
<?php
$messenger->add_warning_message( ‘Warning! Danger Will Robinson!’ );
|
Я обновлю ловушку в методе init Settings_Messenger :
|
1
2
3
4
|
<?php
public function init() {
add_action( ‘tutsplus_settings_messages’, array( $this, ‘get_warning_messages’ ) );
}
|
И тогда я обновлю страницу. Предполагая, что вы правильно выполнили весь приведенный выше код, вы должны увидеть что-то вроде этого:
Если нет, дважды проверьте свой код или загрузите файл проекта, прилагаемый к этому руководству, и мы пойдем оттуда.
Сообщения об ошибках
Наконец, давайте сделаем то же самое для наших сообщений об ошибках. Мы будем повторять в точности то, что мы делали в предыдущих разделах, так что это должно стать немного второстепенным.
Во-первых, нам нужно добавить атрибут, который будет содержать массив, в котором мы будем хранить наши сообщения об ошибках:
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
|
<?php
class Settings_Messenger {
private $success_messages;
private $warning_messages;
private $error_messages;
public function __construct() {
$this->success_messages = array();
$this->warning_messages = array();
$this->error_messages = array();
}
}
|
Во-вторых, нам нужно добавить функцию, которая позволит нам добавить в наш список ошибок:
|
1
2
3
4
5
|
<?php
public function add_error_message( $message ) {
$this->error_messages[] = sanitize_text_field( $message );
}
|
И тогда мы должны иметь возможность отображать их:
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
|
<?php
public function get_error_messages() {
if ( empty( $this->error_messages ) ) {
return;
}
$html = «<div class=’notice notice-error’>»;
$html .= ‘<ul>’;
foreach ( $this->error_messages as $message ) {
$html .= «<li>$message</li>»;
}
$html .= ‘</ul>’;
$html .= ‘</div><!— .notice-error —>’;
$allowed_html = array(
‘div’ => array(
‘class’ => array(),
),
‘ul’ => array(),
‘li’ => array(),
);
echo wp_kses( $html, $allowed_html );
}
|
Чтобы добавить свои собственные сообщения, вернитесь в основной файл плагина и добавьте следующий код:
|
1
2
3
4
5
|
<?php
$messenger->add_error_message( ‘Believe what you want. But neither you nor I are special.’ );
$messenger->add_error_message( ‘In my life, as I was making my way, I always asked the question, am I the most powerful person in the room?’ );
$messenger->add_error_message( ‘People always told me growing up that it\’s never about the destination. It\’s about the journey. But what if the destination is you?’ );
|
Затем обновите функцию init в Settings_Messenger , и вы должны увидеть что-то вроде этого при обновлении страницы:
И именно так вы добавляете пользовательские сообщения на свою страницу администрирования с помощью пользовательских хуков. Но мы должны еще кое-что ввести, прежде чем закончить эту статью.
Уходящие сообщения
Прежде чем мы закончим, я хочу показать, как мы можем сделать наши сообщения неприемлемыми или, проще говоря, удаляемыми пользователем. Для этого мы можем воспользоваться функциональностью, уже встроенной в WordPress.
Поскольку мы просто работали над сообщениями об ошибках, я буду использовать сообщения об ошибках в качестве примера. При построении HTML-кода для сообщений об ошибках добавьте еще одно имя класса к элементу div который содержит сообщения.
То есть, добавьте is-dismissible :
|
1
2
3
4
5
6
7
8
9
|
<?php
$html = «<div class=’notice notice-error is-dismissible’>»;
$html .= ‘<ul>’;
foreach ( $this->error_messages as $message ) {
$html .= «<li>$message</li>»;
}
$html .= ‘</ul>’;
$html .= ‘</div><!— .notice-error —>’;
|
Достаточно просто, не правда ли? Вы получаете значок, который позволяет пользователю щелкнуть по нему, и, когда они это сделают, сообщение исчезнет.
Это хорошая функциональность, которая хорошо вписывается в пользовательский интерфейс WordPress для очень и очень небольшой работы с нашей стороны.
Вывод
Теперь у нас есть довольно функциональный Settings_Messenger . Мы можем добавлять сообщения об успехе, сообщения об ошибках и предупреждающие сообщения. Мы можем отклонить сообщения. Мы можем управлять всем этим независимо от всего, что может делать WordPress.
Но если вы читали любой из моих предыдущих уроков , вы знаете, что я не фанат дублирования кода. Также я не поклонник того, чтобы один класс делал много вещей. И, к сожалению, именно это мы и делаем здесь.
Для целей данного руководства я не планирую рефакторинг кода, который приведен в этом примере. Мы проходили через этот тип материала раньше. Кроме того, цель того, что мы делаем, — показать, как работать с пользовательскими сообщениями об ошибках, а не как применять самые продвинутые объектно-ориентированные методы, которые мы можем (хотя это было бы неплохо, не так ли?).
В зависимости от отзывов, которые я получаю по этой серии, возможно, мы еще раз посетим и проведем рефакторинг, чтобы увидеть, сколько работы можно выполнить и сколько принципов можно применить.
Пока вы ждете публикации следующего урока, обратите внимание, что я также всегда рад ответить на вопросы с помощью комментариев, а также вы можете проверить мой блог и подписаться на меня в Twitter. Я обычно говорю все о разработке программного обеспечения в рамках WordPress и касательных тем, а также.
До этого загрузите доступный исходный код, сравните его с тем, что у нас здесь, и обязательно запустите его на своем локальном компьютере, чтобы вы знали, что осталось, когда мы перейдем к заключительной части этой серии.