Как создать собственный шорткод в WordPress

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

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

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

Например, вы можете создавать шорткод для вывода последних новостей, формы обратной связи, карты или кастомных элементов дизайна. Это особенно полезно, если вы делаете сайт для клиента, который не хочет вникать в код, но хочет иметь возможность вставлять сложные элементы.

Как создать собственный шорткод: базовые шаги

Создание шорткода сводится к созданию PHP-функции, которая возвращает HTML или другой контент, и регистрации этой функции через функцию WordPress add_shortcode. Рекомендуется добавлять свой код в файл functions.php вашей темы или в отдельный плагин, чтобы изменения не потерялись при обновлении темы.

Пример простого шорткода:

function wpboard_hello_shortcode() {
    return '<div>Привет от WPBoard!</div>';
}
add_shortcode('wpboard_hello', 'wpboard_hello_shortcode');

Теперь в записи или странице вы можете вставить [wpboard_hello], и при выводе на сайте появится блок с текстом.

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

• wpboard_hello_shortcode — функция, которая возвращает HTML-контент для шорткода.
• add_shortcode — функция WordPress, которая регистрирует шорткод с указанным именем и связывает его с вашей функцией.

Шорткод с параметрами: как принимать аргументы

Чтобы сделать шорткод более гибким, можно добавлять параметры. Это позволяет задавать разные настройки прямо в шорткоде, например, [wpboard_hello name="Иван"]. В функции принимаются аргументы в виде массива.

function wpboard_greet_shortcode($atts) {
    $atts = shortcode_atts(
        array(
            'name' => 'Гость',
        ), $atts, 'wpboard_greet'
    );

    return '<div>Привет, ' . esc_html($atts['name']) . '!</div>';
}
add_shortcode('wpboard_greet', 'wpboard_greet_shortcode');

В этом примере, если параметр name не указан, по умолчанию будет использоваться «Гость».

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

Рассмотрим более сложный пример — шорткод, который выводит список последних записей блога с настраиваемым количеством.

function wpboard_latest_posts_shortcode($atts) {
    $atts = shortcode_atts(
        array(
            'count' => 5,
        ), $atts, 'wpboard_latest_posts'
    );

    $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('wpboard_latest_posts', 'wpboard_latest_posts_shortcode');

Использование: [wpboard_latest_posts count="3"] выведет последние 3 записи.

Объяснение

Мы используем класс WP_Query для выборки записей и формируем HTML-список с ссылками. После цикла обязательно вызываем wp_reset_postdata() для восстановления глобальных данных.

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

При создании шорткодов важно не забывать об обработке входных данных — использовать функции экранирования, такие как esc_html() или esc_attr(), чтобы предотвратить XSS-атаки. Также не рекомендуется выполнять тяжелые запросы или сложные операции в шорткодах, так как они вызываются при каждом выводе страницы.

Если шорткод генерирует большой объем данных, подумайте о кэшировании результата с помощью транзиентов или внешних кэширующих плагинов.

Расширение функционала: вложенные шорткоды и шорткоды с контентом

Шорткоды могут принимать не только параметры, но и контент между открывающим и закрывающим тегами. Это позволяет создавать более сложные конструкции.

function wpboard_box_shortcode($atts, $content = null) {
    $atts = shortcode_atts(array(
        'color' => 'blue',
    ), $atts, 'wpboard_box');

    $content = do_shortcode($content); // Обрабатываем вложенные шорткоды

    return '<div style="border:2px solid ' . esc_attr($atts['color']) . '; padding:10px;">' . $content . '</div>';
}
add_shortcode('wpboard_box', 'wpboard_box_shortcode');

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

[wpboard_box color="red"]Содержимое внутри красной рамки[/wpboard_box]

Такой шорткод создаст блок с красной рамкой и заданным содержимым внутри. Вложенные шорткоды будут корректно обработаны благодаря вызову do_shortcode().