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

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

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

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

Использование шорткодов экономит время, упрощает управление контентом и позволяет даже не разработчикам легко расширять возможности сайта.

Встроенных шорткодов в WordPress немного, поэтому зачастую приходится создавать свои. В следующем разделе разберём, как это сделать.

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

Для создания шорткода нужно зарегистрировать функцию обратного вызова в WordPress с помощью add_shortcode(). Рассмотрим, как создать шорткод [wpdirect_greeting], который выводит приветственное сообщение.

function wpdirect_greeting_shortcode() {
    return '<p>Привет! Это ваш уникальный шорткод.</p>';
}
add_shortcode('wpdirect_greeting', 'wpdirect_greeting_shortcode');

Добавьте этот код в файл functions.php вашей темы или в специально созданный плагин. После этого в любом месте сайта, где вы вставите [wpdirect_greeting], появится сообщение.

Важные рекомендации

• Используйте уникальные префиксы для функций и шорткодов, чтобы избежать конфликтов — например, wpdirect_.
• Старайтесь, чтобы функция возвращала строку, а не выводила её напрямую.
• Обрабатывайте атрибуты шорткода для гибкости.

Добавление параметров к шорткоду: динамический контент

Часто хочется, чтобы шорткод был универсальным, адаптировался под разные параметры. Для этого в функцию передаются атрибуты.

Например, расширим шорткод [wpdirect_greeting], чтобы он принимал параметр name и приветствовал конкретного пользователя.

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

Теперь вызов [wpdirect_greeting name="Иван"] выведет «Привет, Иван! Добро пожаловать на сайт.»

Безопасность и валидация данных

Обязательно обрабатывайте входящие данные через функции esc_html(), esc_attr() и другие для предотвращения XSS-атак. Никогда не выводите необработанные данные из атрибутов.

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

1. Кнопка с кастомным URL и стилем

function wpdirect_button_shortcode($atts) {
    $atts = shortcode_atts(array(
        'url' => '#',
        'text' => 'Кнопка',
        'class' => 'wpdirect-button'
    ), $atts, 'wpdirect_button');

    return '<a href="' . esc_url($atts['url']) . '" class="' . esc_attr($atts['class']) . '">' . esc_html($atts['text']) . '</a>';
}
add_shortcode('wpdirect_button', 'wpdirect_button_shortcode');

Вызов: [wpdirect_button url="https://wpdirect.ru" text="Перейти на сайт" class="btn-primary"]

2. Вывод последних записей блога

function wpdirect_latest_posts_shortcode($atts) {
    $atts = shortcode_atts(array('count' => 5), $atts, 'wpdirect_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('wpdirect_latest_posts', 'wpdirect_latest_posts_shortcode');

Вызов: [wpdirect_latest_posts count="3"] выведет список из трёх последних статей.

Подключение шорткодов через плагин: пример структуры

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

Создайте папку wpdirect-shortcodes в wp-content/plugins и файл wpdirect-shortcodes.php с таким содержимым:

<?php
/**
 * Plugin Name: WPDirect Shortcodes
 * Description: Набор уникальных шорткодов для сайта.
 * Version: 1.0
 * Author: WPDirect
 */

// Вставьте сюда все функции шорткодов из примеров выше

if (!defined('ABSPATH')) exit; // Защита от прямого доступа

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

// Аналогично добавьте другие шорткоды

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

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

1. При разработке используйте функцию error_log() для записи отладочной информации в файл логов.

2. Избегайте прямого вывода через echo, всегда возвращайте строки из функции шорткода.

3. Кэшируйте результаты сложных вычислений или запросов, чтобы ускорить загрузку страниц.

4. Проверяйте совместимость с другими плагинами и темой, чтобы избежать конфликтов.

5. Используйте nonce и проверку прав, если шорткод выполняет действия, связанные с безопасностью.