Урок 2. Разработка шорткода для плагина WP Post Autocomplete

Урок 2. Разработка шорткода для плагина WP Post Autocomplete

Продолжим разработку нашего WP плагина по автокомплиту постов. Сегодня мы создадим шорткод с полем ввода для искомого текста.
Для формирования кода плагина, грубо говоря, можно использовать два подхода:

  1. Использовать функции для написания хуков, фильтров, хелперов, пр.. При этом, добавлять в начало каждой функции уникальный префикс. Чтобы не было конфликтов с названиями ф-й других плагинов/тем, или движком ВП.
  2. Или использовать класс(ы), для разработки. Да, здесь нам так же придется использовать префиксы, но значительно меньше, т. к. вся логика будет скрыта в методах класса.

В самом начале, как я познакомился с вордпрессом я использовал второй подход, и пока что не жалею. К примеру, если плагин «маленький», и логика его довольно простая — я использую один класс. Если нужна отдельно админка, фронтенд, пр. — разделяю логику на несколько классов, и использую автолоадер для автоматического подключения классов. Но все индивидуально, и можно просто заинклудить нужный файл. В нашем случае, т. к. проект маленький, мы будем использовать один файл и один класс.
Продолжаем. Открываем файл плагина созданный в прошлом уроке по адресу «/wp-content/plugins/wp-post-autocomplete/wp-post-autocomplete.php». И создадим класс с названием «WpPostAutocomplete», со следующим содержимым:

if(class_exists('WpPostAutocomplete') == false):
	class WpPostAutocomplete
	{
		public function __construct()
		{
			add_shortcode('post-autocomplete-form', array($this, 'post_autocomplete_form'));
		}

		/**
		 * Отображает форму поиска
		 */
		public function post_autocomplete_form()
		{
			$content  = '<div class="wrap-post-autocomplete">';
			$content .= '<input type="text" class="post-autocomplete-field" placeholder="Введите текст для поиска">';
			$content .= '</div>';

			return $content;
		}
	}

	new WpPostAutocomplete();
endif;

Разберем наш код.

Конструкцией if:

if(class_exists('WpPostAutocomplete') == false):
/* … */
endif;

проверяем, существует ли класс с таким же названием. Если нет — создаем его. В противном случае… ничего не делаем.

В конструкторе, вызываем функцию «add_shortcode». В качестве названия шорткода, используем —«post-autocomplete-form». А для формирования кода — метод текущего класса «post_autocomplete_form()». Метод должен быть публичный (public), иначе возникнет ошибка.

В самом методе — формируем HTML код с полем для ввода искомого поста, и оборачиваем его в врапер с классом «wrap-post-autocomplete»:

$content  = '<div class="wrap-post-autocomplete">';
$content .= '<input type="text" class="post-autocomplete-field" placeholder="Введите текст для поиска">';
$content .= '</div>';
return $content;

Сам врапер, нам понадобится в работе с js автокомплита.

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

Сохраните и перейдите к просмотру записи. Вы должны будете увидеть следующее:

На этом все. Код урока можно найти на гитхабе перейдя этой ссылке.

Урок 2. Разработка шорткода для плагина WP Post Autocomplete
Добавить комментарий

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