Шорткоды — это мощный инструмент в WordPress, который позволяет быстро вставлять динамический контент в записи, страницы или виджеты. В этой статье мы подробно разберём, как создать собственный шорткод, как передавать параметры, и рассмотрим несколько практических примеров. Это поможет вам расширить функциональность вашего сайта без необходимости писать сложный код в шаблонах.
Что такое шорткод в WordPress и зачем он нужен
Шорткод — это специальный тег в квадратных скобках, например, [gallery], который WordPress автоматически заменяет на определённый контент при выводе страницы. Они помогают создавать легко управляемые и повторно используемые блоки с динамическими данными.
Использование шорткодов позволяет:
- Вставлять сложный функционал без прямого редактирования шаблонов;
- Давать пользователям простой способ размещать интерактивный контент;
- Облегчать поддержку и расширение функционала сайта.
Создавая собственные шорткоды, вы получаете полный контроль над выводом и поведением блока на сайте.
Как создать простой шорткод в WordPress
Для начала создадим базовый шорткод, который выводит приветствие. Рекомендуется добавлять код в файл functions.php вашей темы или лучше — в отдельный плагин, чтобы сохранить изменения при обновлении темы.
function wpcode_hello_shortcode() {
return '<p>Привет от wp-code.ru!</p>';
}
add_shortcode('wpcode_hello', 'wpcode_hello_shortcode');Теперь, если в редакторе записей вставить [wpcode_hello], на странице появится текст «Привет от wp-code.ru!».
Этот пример очень простой, но он демонстрирует основу: функция, которая возвращает HTML, и регистрация шорткода с помощью add_shortcode().
Передача параметров в шорткод: динамический контент
Часто нужно, чтобы шорткод принимал параметры для управления выводом. Рассмотрим пример, где шорткод выводит приветствие с именем пользователя:
function wpcode_greet_shortcode($atts) {
$attributes = shortcode_atts(
array('name' => 'гость'),
$atts
);
$name = esc_html($attributes['name']);
return "<p>Привет, $name! Добро пожаловать на wp-code.ru.</p>";
}
add_shortcode('wpcode_greet', 'wpcode_greet_shortcode');Теперь можно использовать шорткод так: [wpcode_greet name="Иван"], и на странице выведется «Привет, Иван! Добро пожаловать на wp-code.ru.»
Функция shortcode_atts() задаёт значения по умолчанию для параметров, а esc_html() обеспечивает безопасность вывода.
Практический пример: шорткод для вывода последних записей в блоге
Создадим шорткод, который выводит список последних N записей с заголовками и ссылками. Это полезно, если вы хотите встроить свежие новости в любую страницу или виджет.
function wpcode_recent_posts_shortcode($atts) {
$atts = shortcode_atts(array(
'count' => 5,
), $atts);
$count = intval($atts['count']);
$query = new WP_Query(array(
'posts_per_page' => $count,
'post_status' => 'publish',
));
if (!$query->have_posts()) {
return '<p>Записей не найдено.</p>';
}
$output = '<ul>';
while ($query->have_posts()) {
$query->the_post();
$title = get_the_title();
$link = get_permalink();
$output .= "<li><a href='$link'>$title</a></li>";
}
wp_reset_postdata();
$output .= '</ul>';
return $output;
}
add_shortcode('wpcode_recent_posts', 'wpcode_recent_posts_shortcode');Теперь, вставив [wpcode_recent_posts count="3"], вы получите список из трёх последних опубликованных записей с ссылками.
Как улучшить и кастомизировать шорткод с постами
Можно добавить параметры, чтобы фильтровать по рубрикам, форматировать вывод или выводить дату публикации. Например, добавим параметр категории:
function wpcode_recent_posts_shortcode($atts) {
$atts = shortcode_atts(array(
'count' => 5,
'category' => '',
), $atts);
$count = intval($atts['count']);
$category = sanitize_text_field($atts['category']);
$args = array(
'posts_per_page' => $count,
'post_status' => 'publish',
);
if ($category) {
$args['category_name'] = $category;
}
$query = new WP_Query($args);
if (!$query->have_posts()) {
return '<p>Записей не найдено.</p>';
}
$output = '<ul>';
while ($query->have_posts()) {
$query->the_post();
$title = get_the_title();
$link = get_permalink();
$date = get_the_date('d.m.Y');
$output .= "<li><a href='$link'>$title</a> <span>($date)</span></li>";
}
wp_reset_postdata();
$output .= '</ul>';
return $output;
}
add_shortcode('wpcode_recent_posts', 'wpcode_recent_posts_shortcode');Теперь можно использовать шорткод так: [wpcode_recent_posts count="5" category="novosti"] — и выведется 5 последних записей из категории «новости» с датами.
Использование популярных плагинов для расширения шорткодов
Если вы не хотите писать код самостоятельно, существуют плагины, которые упрощают создание и управление шорткодами:
- Shortcodes Ultimate — предоставляет набор готовых шорткодов и визуальный конструктор;
- WP Shortcode — облегчает вставку элементов интерфейса без кода;
- Custom Content Shortcode — позволяет создавать свои шорткоды через интерфейс.
Однако собственный код даёт максимальную гибкость и производительность без лишних зависимостей.
Советы по безопасности и производительности при создании шорткодов
При создании шорткодов важно учитывать несколько моментов:
- Используйте функции экранирования вывода, например,
esc_html()иesc_url(), чтобы предотвратить XSS-атаки; - Избегайте тяжёлых запросов к базе данных в шорткодах, кешируйте результаты при необходимости;
- Всегда используйте
wp_reset_postdata()после кастомных запросов, чтобы не сломать глобальный цикл; - Не выводите напрямую пользовательские данные без очистки и проверки.
Следуя этим рекомендациям, вы создадите безопасные и эффективные шорткоды для вашего сайта.
Заключение по созданию шорткодов на wp-code.ru
Создание собственных шорткодов — это простой и мощный способ добавить уникальный функционал в WordPress без сложных доработок темы. С помощью примеров из статьи вы можете создавать шорткоды для вывода динамического контента, управлять параметрами и обеспечивать безопасность вывода. Это отличный инструмент в арсенале разработчика и администратора WordPress.