Как создать свой шорткод в WordPress

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

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

Шорткод — это упрощенный способ вставки динамического контента. Например, [gallery] выводит галерею изображений, а [contact-form-7] вставляет форму обратной связи. Но что делать, если готового шорткода нет? Ответ — создавать свои.

С помощью шорткодов можно:

• Вставлять кастомный HTML, CSS и JS без правки темы
• Добавлять повторяющиеся элементы (таблицы, кнопки, блоки с информацией)
• Подключать результаты работы PHP-функций прямо в записи

Это особенно полезно, когда вы разрабатываете сайт на WordPress и хотите дать возможность контент-менеджерам легко добавлять сложные элементы без программирования.

Как создать шорткод в WordPress — базовый пример

Основная функция для создания шорткода — add_shortcode(). Она принимает два параметра — имя шорткода и функцию-обработчик.

function wp_course_custom_shortcode() {
    return '<div style="padding:10px; background:#f0f0f0; border:1px solid #ccc;">Это мой кастомный шорткод!</div>';
}
add_shortcode('wp_course_box', 'wp_course_custom_shortcode');

Теперь в записи вы можете написать [wp_course_box] — и увидите стилизованный блок с текстом. В обработчике вы можете писать любой PHP-код, чтобы генерировать нужный HTML.

Передача параметров в шорткод

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

function wp_course_custom_shortcode_atts($atts) {
    $atts = shortcode_atts(
        array(
            'text' => 'Привет, мир!',
            'color' => '#ff0000',
        ), $atts, 'wp_course_box'
    );

    return '<div style="padding:10px; background:' . esc_attr($atts['color']) . '; color:#fff;">' . esc_html($atts['text']) . '</div>';
}
add_shortcode('wp_course_box', 'wp_course_custom_shortcode_atts');

Теперь можно писать [wp_course_box text="Текст шорткода" color="#009900"], и блок будет выводиться с заданными параметрами.

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

1. Шорткод вывода последних записей из заданой категории

Этот шорткод выведет список из 5 последних постов определённой категории:

function wp_course_latest_posts_shortcode($atts) {
    $atts = shortcode_atts(array(
        'category' => '',
        'posts' => 5,
    ), $atts, 'wp_course_latest_posts');

    $query = new WP_Query(array(
        'category_name' => sanitize_text_field($atts['category']),
        'posts_per_page' => intval($atts['posts']),
    ));

    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('wp_course_latest_posts', 'wp_course_latest_posts_shortcode');

Используйте так: [wp_course_latest_posts category="wordpress" posts="3"]. Это выведет 3 последних поста из категории "wordpress".

2. Шорткод для вывода текущей даты и времени

Простой шорткод для вставки даты и времени по заданному формату:

function wp_course_current_datetime_shortcode($atts) {
    $atts = shortcode_atts(array(
        'format' => 'd.m.Y H:i:s',
    ), $atts, 'wp_course_datetime');

    return date($atts['format']);
}
add_shortcode('wp_course_datetime', 'wp_course_current_datetime_shortcode');

Пример использования: [wp_course_datetime format="l, d F Y"]

Используем плагины для расширения возможностей шорткодов

Если вы хотите быстро создавать и настраивать шорткоды без программирования, обратите внимание на популярные плагины:

• Shortcodes Ultimate — набор из более 50 готовых шорткодов с визуальным редактором и настройками.
• WP Shortcode by MyThemeShop — простой и легкий плагин с базовым набором элементов.
• Custom Content Shortcode — позволяет создавать шорткоды для отображения контента с условиями и параметрами.

Но если нужно что-то уникальное, лучше писать свои шорткоды, как показано выше.

Советы по безопасности и оптимизации при работе с шорткодами

При создании шорткодов нужно помнить несколько правил:

• Очистка входных данных. Всегда фильтруйте параметры с помощью функций типа sanitize_text_field, intval, чтобы избежать XSS и SQL-инъекций.
• Экранирование вывода. Используйте esc_html, esc_attr для вывода переменных в HTML.
• Минимизация нагрузки. Не делайте сложные запросы в цикле, кешируйте результаты при необходимости.
• Избегайте конфликтов имён. Добавляйте префиксы к функциям и шорткодам, например, wp_course_, чтобы не пересекаться с другими плагинами.

Соблюдение этих правил поможет избежать проблем с безопасностью и производительностью сайта.

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

По умолчанию в виджетах типа «Текст» шорткоды не всегда работают. Чтобы их включить, добавьте в functions.php вашей темы:

add_filter('widget_text', 'do_shortcode');

Также шорткод можно вывести напрямую из PHP в шаблоне:

echo do_shortcode('[wp_course_box text="Привет из шаблона" color="#0055aa"]');

Это позволяет гибко использовать шорткоды в любом месте сайта.