Как создать собственный шорткод в WordPress: практическое руководство

Автор: Ярослав Васильев | Опубликовано: 08.11.2025

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

Что такое шорткод в WordPress и зачем он нужен

Шорткод представляет собой небольшой тег, который вы вставляете в контент страницы или поста, и WordPress заменяет этот тег на сгенерированный динамический контент. Это позволяет:

Упрощать работу с повторяющимися элементами.
Избавиться от необходимости писать длинный код в каждом посте.
Расширять функциональность сайта без вмешательства в тему или плагины.

Например, вместо сложного HTML-кода для вставки формы обратной связи вы просто добавляете [feedback_form].

Основы создания собственного шорткода в WordPress

Для создания собственного шорткода используется функция add_shortcode(). Она принимает два аргумента: тег шорткода и callback-функцию, которая возвращает HTML-код для вывода.

Рассмотрим простой пример шорткода, который выводит приветствие с вашим именем:

function wpvip_greeting_shortcode($atts) {
    $attributes = shortcode_atts( array(
        'name' => 'Гость',
    ), $atts );
    return '<p>Привет, ' . esc_html($attributes['name']) . '! Добро пожаловать на сайт.</p>';
}
add_shortcode('wpvip_greeting', 'wpvip_greeting_shortcode');

В этом примере мы определили шорткод [wpvip_greeting name="Иван"], который выведет "Привет, Иван! Добро пожаловать на сайт."

Пояснение к коду

Функция shortcode_atts() задаёт значения по умолчанию для атрибутов шорткода, что позволяет избежать ошибок, если атрибут не указан.

Функция esc_html() защищает вывод от XSS-атак, экранируя специальные символы.

Примеры полезных шорткодов для реальных задач

1. Шорткод для вставки кнопки с кастомными параметрами

Представим, что вам часто нужна кнопка с разной ссылкой и текстом. Создадим шорткод:

function wpvip_button_shortcode($atts) {
    $atts = shortcode_atts(array(
        'url' => '#',
        'text' => 'Нажми меня',
        'color' => 'blue'
    ), $atts);
    return '<a href="' . esc_url($atts['url']) . '" style="background-color:' . esc_attr($atts['color']) . '; padding:10px 20px; color:#fff; text-decoration:none; border-radius:5px;">' . esc_html($atts['text']) . '</a>';
}
add_shortcode('wpvip_button', 'wpvip_button_shortcode');

Используйте так: [wpvip_button url="https://wpvip.ru" text="Перейти на WPVIP" color="green"].

2. Шорткод для вывода последних 3 постов с заголовками и ссылками

Этот шорткод поможет вывести динамический список из последних записей блога:

function wpvip_recent_posts_shortcode($atts) {
    $atts = shortcode_atts(array(
        'count' => 3
    ), $atts);
    $query = new WP_Query(array(
        'posts_per_page' => intval($atts['count']),
        'post_status' => 'publish'
    ));
    if (!$query->have_posts()) {
        return '<p>Нет доступных записей.</p>';
    }
    $output = '<ul>';
    while ($query->have_posts()) {
        $query->the_post();
        $output .= '<li><a href="' . get_permalink() . '">' . get_the_title() . '</a></li>';
    }
    wp_reset_postdata();
    $output .= '</ul>';
    return $output;
}
add_shortcode('wpvip_recent_posts', 'wpvip_recent_posts_shortcode');

Вызов: [wpvip_recent_posts count="5"] — выведет 5 последних постов.

Обработка параметров и безопасность шорткодов

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

shortcode_atts() для установки значений по умолчанию.
Функции экранирования: esc_html(), esc_attr(), esc_url() в зависимости от контекста.
Проверяйте типы данных, особенно если параметры используются в запросах.

Например, параметр count в запросе WP_Query приведён к целому числу через intval(), чтобы исключить опасные значения.

Регистрация шорткодов в плагине или functions.php

Рекомендуется создавать собственные шорткоды в виде плагина, чтобы не потерять их при обновлении темы. Для этого создайте файл wpvip-shortcodes.php в директории wp-content/plugins с содержимым:

<?php
/**
 * Plugin Name: WPVIP Shortcodes
 * Description: Собственные шорткоды для сайта WPVIP
 * Version: 1.0
 * Author: WPVIP
 */

// Здесь вставьте функции шорткодов

Активируйте плагин через админку — и шорткоды будут доступны.

Отладка и тестирование шорткодов

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

Проверяйте вывод на пустые или некорректные данные.
Используйте error_log() или WP_DEBUG для выявления ошибок.
Тестируйте шорткоды на разных страницах и с разными параметрами.

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

Заключение

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