Что такое шорткоды в WordPress и зачем они нужны
Шорткоды — это удобный способ добавлять функционал и контент в записи, страницы или виджеты без необходимости писать сложный код каждый раз. Они представляют собой специальные метки в квадратных скобках, например [gallery] или [wpin_custom], которые WordPress преобразует в нужный HTML или выполняет определённый PHP-код.
Использование шорткодов позволяет создать повторно используемые блоки функционала, которые можно легко вставлять в любой контент. Это упрощает работу с сайтом, особенно если нужно часто выводить сложные элементы, например, формы, таблицы, специальные блоки с данными из базы.
Для разработчика добавление собственного шорткода — это простой и эффективный способ расширить возможности темы или плагина без вмешательства в шаблоны.
Как создать свой шорткод в WordPress: базовый пример
Для создания шорткода нужно зарегистрировать его с помощью функции add_shortcode(). Рассмотрим минимальный пример.
function wpin_custom_shortcode() {
return '<div style="padding:10px; background:#f0f0f0; border:1px solid #ccc;">Это мой кастомный шорткод</div>';
}
add_shortcode('wpin_custom', 'wpin_custom_shortcode');Этот код нужно добавить в файл functions.php вашей темы или в файл плагина. После этого в любом месте контента можно использовать [wpin_custom], и WordPress заменит этот шорткод на HTML-блок.
Обратите внимание, что функция возвращает строку, а не выводит её напрямую. Это важно, чтобы WordPress корректно обработал вывод.
Шорткод с параметрами: как передавать аргументы
Часто шорткодам нужны параметры для настройки вывода. Например, шорткод галереи принимает атрибуты типа ids или columns. Добавим в наш пример параметр color, чтобы менять цвет фона блока.
function wpin_custom_shortcode_atts($atts) {
$atts = shortcode_atts(array(
'color' => '#f0f0f0',
'text' => 'Это мой кастомный шорткод'
), $atts, 'wpin_custom');
return '<div style="padding:10px; background:' . esc_attr($atts['color']) . '; border:1px solid #ccc;">' . esc_html($atts['text']) . '</div>';
}
add_shortcode('wpin_custom', 'wpin_custom_shortcode_atts');Теперь в контенте можно писать [wpin_custom color="#d0f0d0" text="Привет из WPIN"], и шорткод отобразит блок с указанным цветом и текстом.
Использование функции shortcode_atts() позволяет задать значения по умолчанию и безопасно получить параметры, а функции esc_attr() и esc_html() защищают вывод от XSS-атак.
Сложные шорткоды: вывод данных из базы и использование шаблонов
Иногда шорткод должен выводить динамические данные, например, список последних записей, контакты или результаты запроса к базе. Рассмотрим пример шорткода, который выводит последние 5 постов с определённой категорией.
function wpin_recent_posts_shortcode($atts) {
$atts = shortcode_atts(array(
'count' => 5,
'category' => ''
), $atts, 'wpin_recent_posts');
$query_args = array(
'posts_per_page' => intval($atts['count']),
'post_status' => 'publish'
);
if (!empty($atts['category'])) {
$query_args['category_name'] = sanitize_text_field($atts['category']);
}
$query = new WP_Query($query_args);
if (!$query->have_posts()) {
return '<p>Нет записей.</p>';
}
$output = '<ul class="wpin-recent-posts">';
while ($query->have_posts()) {
$query->the_post();
$output .= '<li><a href="' . esc_url(get_permalink()) . '">' . esc_html(get_the_title()) . '</a></li>';
}
wp_reset_postdata();
$output .= '</ul>';
return $output;
}
add_shortcode('wpin_recent_posts', 'wpin_recent_posts_shortcode');Используйте шорткод [wpin_recent_posts count="3" category="novosti"], чтобы вывести 3 последних новости. Такой подход позволяет создавать мощные и настраиваемые решения.
Оптимизация и безопасность шорткодов
При работе с шорткодами важно помнить про безопасность. Никогда не выводите данные напрямую без обработки. Используйте функции эскейпинга (esc_html, esc_attr, esc_url) для защиты от XSS.
Кроме того, не стоит выполнять тяжелые запросы в шорткодах — это может замедлить загрузку страниц. Если требуется сложная логика, рассмотрите кеширование результатов с помощью Transients API.
Также избегайте глобальных изменений в состоянии сайта (например, изменение глобальных переменных) внутри функций шорткодов, чтобы не нарушать работу темы и плагинов.
Использование готовых плагинов для создания шорткодов
Если вы не хотите писать код с нуля, можно воспользоваться плагинами, которые упрощают создание шорткодов:
- Shortcodes Ultimate — содержит множество готовых шорткодов и визуальный редактор для их вставки.
- WP Shortcode by MyThemeShop — простой плагин с набором полезных шорткодов для контента.
- Custom Shortcodes — позволяет создавать свои шорткоды через админку без кодинга.
Однако, если нужно что-то уникальное и точное под задачи, лучше написать собственный шорткод, как мы показали выше.
Как зарегистрировать шорткод в плагине: пример структуры
Для поддержки масштабируемости и удобства обслуживания рекомендуем создавать шорткоды в плагинах, а не в файле темы. Вот пример базового плагина, который регистрирует шорткод:
<?php
/**
* Plugin Name: WPIN Custom Shortcodes
* Description: Плагин с кастомными шорткодами для сайта WPIN.ru
* Version: 1.0
* Author: WPIN Team
*/
function wpin_custom_shortcode_plugin() {
return '<div style="padding:10px; background:#e0f7fa; border:1px solid #00796b;">Плагинный шорткод WPIN</div>';
}
add_shortcode('wpin_plugin_shortcode', 'wpin_custom_shortcode_plugin');
Загрузите этот файл в папку wp-content/plugins/wpin-custom-shortcodes/, активируйте плагин и используйте [wpin_plugin_shortcode] в контенте.
Итоги и рекомендации по работе с шорткодами в WordPress
Шорткоды — мощный инструмент для расширения функционала WordPress. Они позволяют внедрять динамический контент без сложных правок шаблонов. Важно правильно обрабатывать входные данные и безопасно выводить контент, чтобы не создавать уязвимости.
Создавайте шорткоды в виде плагинов для удобства поддержки и переноса. Используйте параметры для гибкости и создавайте удобные интерфейсы для пользователей.
Если нужно быстро и без кода — обратитесь к популярным плагинам с готовыми шорткодами и визуальными редакторами.