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

Автор: Андрей Карпов | Опубликовано: 12.11.2025

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

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

Шорткод — это специальный тег в квадратных скобках, например, [wplearn_example], который WordPress заменяет на определенный код или вывод во время формирования страницы. Это позволяет:

Легко добавлять сложный HTML, PHP или JavaScript в записи и страницы
Повторно использовать блоки кода без дублирования
Скрывать техническую реализацию от контент-редакторов

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

Создание собственного шорткода: пример от wplearn

Рассмотрим как создать простой шорткод, который выводит текущую дату в заданном формате. Начнем с базового кода, который нужно добавить в файл functions.php вашей темы или в отдельный плагин.

function wplearn_current_date_shortcode($atts) {
    $atts = shortcode_atts(
        array('format' => 'd.m.Y'), // формат даты по умолчанию
        $atts,
        'wplearn_current_date'
    );
    return date($atts['format']);
}
add_shortcode('wplearn_current_date', 'wplearn_current_date_shortcode');

Теперь в любом месте контента можно написать [wplearn_current_date] и получить дату в формате день.месяц.год, например, 25.04.2024.

Если нужно изменить формат, указываем атрибут, например: [wplearn_current_date format="Y-m-d"] — и будет выведено 2024-04-25.

Разбор кода шорткода

Функция wplearn_current_date_shortcode принимает массив атрибутов $atts, который мы обрабатываем с помощью shortcode_atts — это стандартный способ задать значения по умолчанию и объединить их с пользовательскими.

Далее функция возвращает строку с текущей датой, отформатированной по переданному шаблону. В конце с помощью add_shortcode регистрируем шорткод по имени wplearn_current_date.

Как добавить параметры и вложенный контент в шорткод

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

function wplearn_box_shortcode($atts, $content = null) {
    $atts = shortcode_atts(
        array('color' => '#f0f0f0'),
        $atts,
        'wplearn_box'
    );
    return '<div style="background-color:' . esc_attr($atts['color']) . '; padding: 15px; border-radius: 5px;">' . do_shortcode($content) . '</div>';
}
add_shortcode('wplearn_box', 'wplearn_box_shortcode');

Использование в контенте:

[wplearn_box color="#aee1f9"]Это важное уведомление![/wplearn_box]

Этот шорткод создаст голубой блок с текстом внутри. Благодаря вызову do_shortcode($content) внутри функции, вы можете даже вкладывать другие шорткоды внутрь.

Практические советы по работе с шорткодами

Обработка безопасности и очистка данных

Всегда учитывайте, что атрибуты шорткода могут содержать пользовательские данные. Используйте функции esc_attr(), esc_html() и подобные для экранирования, чтобы предотвратить XSS-уязвимости.

Кеширование результатов шорткодов

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

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

Тестируйте шорткоды в разных местах сайта: в записях, виджетах, в блоке «HTML» редактора Gutenberg. Для отладки используйте error_log и WP_DEBUG.

Пример сложного шорткода для вывода последних записей с миниатюрами

Создадим шорткод, который выводит последние 3 записи с миниатюрами и ссылками на них. Это полезно для боковой панели или в конце статей.

function wplearn_latest_posts_shortcode($atts) {
    $atts = shortcode_atts(array('count' => 3), $atts, 'wplearn_latest_posts');
    $query = new WP_Query(array(
        'posts_per_page' => intval($atts['count']),
        'post_status' => 'publish'
    ));
    if(!$query->have_posts()) return '<p>Нет записей для отображения.</p>';

    $output = '<div class="wplearn-latest-posts"><ul>';
    while($query->have_posts()) {
        $query->the_post();
        $thumb = has_post_thumbnail() ? get_the_post_thumbnail(get_the_ID(), 'thumbnail') : '<img src="' . esc_url(get_template_directory_uri() . '/images/no-image.png') . '" alt="no image" />';
        $output .= '<li><a href="' . get_permalink() . '" title="' . esc_attr(get_the_title()) . '">' . $thumb . '<br>' . get_the_title() . '</a></li>';
    }
    wp_reset_postdata();
    $output .= '</ul></div>';
    return $output;
}
add_shortcode('wplearn_latest_posts', 'wplearn_latest_posts_shortcode');

Используйте шорткод в записи: [wplearn_latest_posts count="5"] — и выведется 5 последних записей с миниатюрами.

Заключение по теме шорткодов

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

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