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

|

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

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

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

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

  • Удобство для контент-менеджеров — можно вставлять сложные элементы простым тегом.
  • Повторное использование одного и того же функционала в разных местах сайта.
  • Изоляция логики и контента — код хранится в функции, а контент — в записи.

Теперь перейдём к созданию собственного шорткода на примере.

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

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

function wp0_current_date_shortcode() {
    return date('d.m.Y');
}
add_shortcode('wp0_date', 'wp0_current_date_shortcode');

Объяснение кода:

  • wp0_current_date_shortcode — функция, которая возвращает текущую дату в формате день.месяц.год.
  • Функция add_shortcode регистрирует шорткод [wp0_date], который вызывает нашу функцию.

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

Как усложнить шорткод: добавляем параметры

Шорткоды могут принимать параметры, которые позволяют изменять вывод. Расширим наш пример и добавим параметр format, чтобы можно было задавать формат даты:

function wp0_current_date_shortcode($atts) {
    $atts = shortcode_atts(
        array(
            'format' => 'd.m.Y',
        ), $atts, 'wp0_date'
    );
    return date($atts['format']);
}
add_shortcode('wp0_date', 'wp0_current_date_shortcode');

Теперь можно использовать шорткод [wp0_date format="Y-m-d"], и он выведет дату в формате Год-Месяц-День.

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

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

Код шорткода:

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

    $args = array(
        'posts_per_page' => intval($atts['posts']),
        'post_status' => 'publish',
    );

    if (!empty($atts['category'])) {
        $args['category_name'] = sanitize_text_field($atts['category']);
    }

    $query = new WP_Query($args);

    if (!$query->have_posts()) {
        return '<p>Записей не найдено.</p>';
    }

    $output = '<ul class="wp0-recent-posts">';
    while ($query->have_posts()) {
        $query->the_post();
        $output .= '<li><a href="' . get_permalink() . '">' . get_the_title() . '</a> - ' . get_the_date() . '</li>';
    }
    $output .= '</ul>';

    wp_reset_postdata();
    return $output;
}
add_shortcode('wp0_recent_posts', 'wp0_recent_posts_shortcode');

Описание:

  • Параметр posts задаёт количество выводимых записей (по умолчанию 5).
  • Параметр category позволяет фильтровать записи по категории (используется slug категории).
  • Мы используем WP_Query для получения нужных записей.
  • Вывод оформлен в виде списка с ссылками и датами.

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

[wp0_recent_posts posts="3" category="novosti"]

Выведет 3 последние записи из категории «Новости».

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

При создании шорткодов важно учитывать безопасность и оптимизацию:

  • Всегда фильтруйте и очищайте входящие параметры: используйте sanitize_text_field, intval и другие функции очистки.
  • Не выводите данные напрямую — обязательно экранируйте вывод с помощью esc_html или подобных функций, если выводите текст.
  • Избегайте выполнения тяжёлых запросов и оптимизируйте WP_Query, чтобы не замедлять загрузку страницы.
  • При необходимости используйте кэширование результата шорткода, чтобы снизить нагрузку.

Полезные плагины для работы с шорткодами

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

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

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

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

Для отладки шорткодов полезно:

  • Включить WP_DEBUG в wp-config.php для отображения ошибок.
  • Использовать error_log для записи данных в лог.
  • Тестировать разные варианты параметров и контента.
  • Проверять корректность вывода в разных браузерах и на разных устройствах.

Например, добавим в функцию шорткода вывод отладочной информации в лог:

function wp0_current_date_shortcode($atts) {
    error_log('wp0_current_date_shortcode called with: ' . print_r($atts, true));
    $atts = shortcode_atts(
        array(
            'format' => 'd.m.Y',
        ), $atts, 'wp0_date'
    );
    return date($atts['format']);
}

Это поможет понять, какие параметры передаются и как работает функция.

Наш каталог плагинов WordPress