Статьи

Раскройте всю мощь API WordPress Shortcode

WordPress представил Shortcode API в своей версии 2.5. Этот API позволяет разработчикам добавлять более или менее сложные функции в свои плагины или темы без необходимости вставлять HTML-код пользователю.

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

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

Как работает Shortcode API?

Перед использованием Shortcode API важно знать, как он работает для разработчика и конечного пользователя.

Сначала разработчик регистрирует свой шорткод с помощью функции WordPress add_shortcode() . Затем WordPress автоматически обнаружит, когда используется этот шорткод, и вызовет соответствующую функцию, которая заменит шорткод конкретным текстом или HTML кодом.

Для пользователя это действительно просто: они вставляют шорткод в свое сообщение, и этот шорткод будет заменяться при каждом отображении сообщения.

Шорткоды могут быть более или менее сложными. Например, мы можем найти простые шорткоды, такие как [contact] вставляющие контактную форму вместо тега. Другие шорткоды могут быть заполнены некоторым содержимым, например [hello]Me[/hello] , другие снова могут использовать атрибуты, например [sayhello to="You"] . Эти атрибуты могут даже быть безымянными: [sphere 42] является, например, шорткодом с использованием безымянных атрибутов, добавленных плагином WP Photo Sphere . Наконец, некоторые шорткоды могут комбинировать все это, поэтому этот API действительно может сделать некоторые мощные вещи.

Шорткоды без атрибутов

Прежде чем создавать более сложные шорткоды, мы начнем с нескольких примеров без атрибутов. Как обычно, код, представленный здесь, должен быть помещен в файл вашего проекта (например, functions.php для темы).

Создать шорткод

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

 add_shortcode('myshortcode', 'replace_my_shortcode'); 

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

 function replace_my_shortcode() { return 'Hello World!'; } 

Этот пример работает. Если вы напишите пост и вставите в него [myshortcode] , он будет заменен текстом Hello World! , Так что это работает. Но это ограничено и не очень полезно.

Вот почему использование контента шорткода может быть хорошей идеей. Вопрос в том, как извлечь этот контент, если, например, пользователь написал [myshortcode]You[/myshortcode] ?

Чтобы получить этот контент, нам не нужно ничего менять в add_shortcode() , но мы добавим два параметра в нашу replace_my_shortcode() .

 function replace_my_shortcode($atts, $content = '') { return 'Hello ' . $content . '!'; } 

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

Если пользователь включил некоторый контент в шорткод, он будет в переменной $content . В противном случае эта переменная будет пустой строкой, поэтому мы можем обнаружить этот случай с помощью условия, например, с помощью функции empty() .

 function replace_my_shortcode($atts, $content = '') { if (empty($content)) return 'Hello World!'; else return 'Hello ' . $content . '!'; } 

Шорткоды в других шорткодах

Мы знаем, как создать шорткод и как управлять его контентом. Но что, если этот контент содержит другие шорткоды? Например, предположим, что у нас есть два шорткода: [name] которое отображает имя автора, и [myshortcode] с функцией обратного вызова выше. Затем, если пользователь пишет [myshortcode][name][/myshortcode] , результатом будет «Hello [name]!» , Что, безусловно, не то, что мы хотели здесь.

Просьба WordPress проанализировать шорткоды, присутствующие в содержимом другого шорткода, возможна и может быть выполнена с помощью функции do_shortcode() , как вы можете видеть в коде ниже.

 function replace_my_shortcode($atts, $content = '') { return 'Hello ' . do_shortcode($content) . '!'; } 

С этой новой функцией обратного вызова наш предыдущий пример дает нам «Hello Jeremy» в результате (да, у всех нас одинаковое имя!).

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

С помощью функции do_shortcode() такие вещи:

 [myshortcode] [name] [/myshortcode] 

или:

 [myshortcode] [name][/name] [/shortcode] 

будет проанализирован без каких-либо проблем. Но другие вещи, как это:

 [myshortcode] [myshortcode]You[/myshortcode] [/myshortcode] 

проблемные. С последней replace_my_shortcode() показанной выше, результатом будет «Hello Hello! You! [/ Myshortcode]» . Другими словами, первый [/myshortcode] тег [/myshortcode] закрывает первый тег [myshortcode] . Другой тег [myshortcode] становится пустым шорткодом, а последний тег [/myshortcode] просто игнорируется.

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

Шорткоды с атрибутами

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

Обрабатывать атрибуты

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

Структура этого массива точно такая, как мы и ожидали: его ключи — это имена атрибутов, а его значения — их. Например, если пользователь вставил [myshortcode name="Here is my name" n="5"] , то мы найдем этот массив:

 Array ( [name] => Here is my name [n] => 5 ) 

в первом параметре нашей функции.

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

 function replace_my_shortcode($atts, $content = '') { $atts = shortcode_atts(array( 'name' => 'World', 'n' => 1 ), $atts); return 'Hello ' . $atts['name'] . '!'; } 

Эта функция объединит массив $atts предоставленный пользователем, и массив, указанный в первом параметре, который содержит значения по умолчанию. В приведенном выше примере, если пользователь не заполняет атрибут name , мы отображаем «Hello World!» . В противном случае будет использовано указанное имя.

Атрибуты без имени

Иногда неназванный атрибут может быть лучшим решением, чем традиционный. Например, чтобы [myimage id="7"] изображения: [myimage 7] вместо [myimage id="7"] . Проблема возникает, когда мы пытаемся получить эти специальные атрибуты. Без имени для поиска, какой ключ мы должны выбрать?

Что касается других, безымянные атрибуты могут быть найдены в первом параметре нашей функции обратного вызова с пронумерованными ключами. Пример будет понятнее длинного объяснения, поэтому предположим, что пользователь дает нам [myshortcode 7 name="My name"] . Затем мы находим следующий массив в первом параметре нашей функции обратного вызова.

 Array Array ( [0] => 7 [name] => My name ) 

Если существует более одного безымянного атрибута, единственный способ отличить их друг от друга — это их порядок. Например, у нас есть следующий массив, если пользователь вставляет [myshortcode 7 name="My name" display test="value" 22] .

 Array ( [0] => 7 [name] => My name [1] => display [test] => value [2] => 22 ) 

Часто именованные атрибуты предпочтительнее, потому что их легче получить. Тем не менее, безымянные атрибуты не являются большой проблемой, если вы ограничиваете их небольшим числом или если они служат только логическими значениями. На самом деле, такой [myshortcode name="Me" show] как [myshortcode name="Me" show] , безусловно, лучше для пользователя печатать, чем [myshortcode name="Me" show="true"] .

Для логических значений безымянные атрибуты — хорошая идея: мы устанавливаем их как true если они присутствуют, и как false противном случае. Однако здесь остается вопрос: как насчет значений по умолчанию?

Если вы примените функцию shortcode_atts() , возвращаемый массив потеряет пронумерованные ключи. Другими словами, вы не сможете получить безымянные атрибуты после применения функции shortcode_atts() .

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

 function normalize_attributes($atts) { foreach ($atts as $key => $value) { if (is_int($key)) { $atts[$value] = true; unset($atts[$key]); } } return $atts; } не function normalize_attributes($atts) { foreach ($atts as $key => $value) { if (is_int($key)) { $atts[$value] = true; unset($atts[$key]); } } return $atts; } 

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

 function replace_my_shortcode($atts, $content = '') { $atts = normalize_attributes($atts); $atts = shortcode_atts(array( 'name' => 'World', 'hide' => false ), $atts); if (!$atts['hide']) return 'Hello ' . $atts['name'] . '!'; else return ''; } 

В этом примере, если пользователь вставляет [myshortcode name="You"] , мы отображаем «Hello You!» . Однако, если [myshortcode hide] , то мы ничего не отображаем. Абсурд, но вы поняли идею!

В заключение

Shortcode API — это мощный инструмент для разработчиков.

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

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

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

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