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

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

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

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

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

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

Давайте создадим простой шорткод, который выводит приветственное сообщение. Для этого добавим следующий код в файл functions.php вашей темы или в файл вашего собственного плагина.

function wp_lessons_hello_shortcode() {
    return '<p>Привет от wp-lessons.ru!</p>';
}
add_shortcode('wp_lessons_hello', 'wp_lessons_hello_shortcode');

Теперь, если на странице вставить [wp_lessons_hello], то пользователи увидят текст «Привет от wp-lessons.ru!».

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

Шорткод с параметрами: динамический вывод

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

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

Вызов [wp_lessons_greet name="Иван"] выведет «Привет, Иван! Добро пожаловать на wp-lessons.ru.»

Параметры задаются через функцию shortcode_atts(), которая задает значения по умолчанию и объединяет их с переданными.

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

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

function wp_lessons_latest_posts_shortcode($atts) {
    $atts = shortcode_atts(array(
        'count' => 5,
    ), $atts, 'wp_lessons_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('wp_lessons_latest_posts', 'wp_lessons_latest_posts_shortcode');

Шорткод [wp_lessons_latest_posts count="3"] выведет список из 3 последних постов с ссылками.

Безопасность и производительность шорткодов

При создании шорткодов важно помнить о безопасности. Никогда не выводите данные без очистки — используйте функции esc_html() для текста и esc_url() для URL.

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

Пример кеширования результата шорткода

function wp_lessons_cached_shortcode() {
    $cache_key = 'wp_lessons_cached_content';
    $cached = get_transient($cache_key);
    if ($cached !== false) {
        return $cached;
    }
    // Генерируем содержание
    $content = '<p>Данные, которые можно кешировать.</p>';
    set_transient($cache_key, $content, 3600); // кеш на час
    return $content;
}
add_shortcode('wp_lessons_cached', 'wp_lessons_cached_shortcode');

Таким образом, данные не будут генерироваться заново при каждом вызове шорткода.

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

Шорткоды могут принимать контент между открывающим и закрывающим тегом.

function wp_lessons_box_shortcode($atts, $content = null) {
    return '<div style="border:1px solid #ccc; padding:10px; background:#f9f9f9;">' . do_shortcode($content) . '</div>';
}
add_shortcode('wp_lessons_box', 'wp_lessons_box_shortcode');

Использование: [wp_lessons_box]Текст внутри рамки[/wp_lessons_box] выведет текст внутри стилизованного блока.

Также можно вкладывать шорткоды друг в друга — WordPress автоматически обработает вложенные вызовы.

Заключение

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

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