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

Что такое shortcode и зачем он нужен в WordPress

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

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

В этой статье мы подробно рассмотрим, как создать собственный shortcode, как передавать параметры, обрабатывать их, и как обеспечить безопасность и производительность.

Создание базового shortcode в WordPress

Для начала создадим самый простой shortcode, который будет выводить приветственное сообщение. Все функции мы будем называть с префиксом wpfreecourses_, чтобы избежать конфликтов с другими плагинами или темами.

function wpfreecourses_hello_shortcode() {
    return '<p>Привет, это мой первый shortcode в WordPress!</p>';
}
add_shortcode('wpfreecourses_hello', 'wpfreecourses_hello_shortcode');

После добавления этого кода в файл functions.php вашей темы или в файл собственного плагина, вы сможете использовать в любом месте сайта shortcode [wpfreecourses_hello], который выведет на экран приветствие.

Это самый простой пример, но на практике shortcode часто требуют передачи параметров и более сложной логики.

Использование параметров в shortcode: динамический вывод

Добавим возможность передавать параметры в shortcode, например, имя пользователя, чтобы приветствие было персонализированным.

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

Теперь, вставив в контент [wpfreecourses_greet name="Андрей"], вы получите персональное приветствие. Если параметр не передан, по умолчанию используется «Гость».

Важно использовать функцию esc_html() для экранирования вывода и защиты от XSS-атак.

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

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

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

function wpfreecourses_datetime_shortcode($atts) {
    $atts = shortcode_atts(
        array('format' => 'd.m.Y H:i'),
        $atts,
        'wpfreecourses_datetime'
    );
    return '<time>' . date($atts['format']) . '</time>';
}
add_shortcode('wpfreecourses_datetime', 'wpfreecourses_datetime_shortcode');

Использование: [wpfreecourses_datetime format="Y-m-d"] выведет дату в формате ГГГГ-ММ-ДД.

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

Часто нужно показать последние записи в любом месте сайта. Вот простой пример без плагинов.

function wpfreecourses_latest_posts_shortcode($atts) {
    $atts = shortcode_atts(array('count' => 5), $atts, 'wpfreecourses_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('wpfreecourses_latest_posts', 'wpfreecourses_latest_posts_shortcode');

Пример использования: [wpfreecourses_latest_posts count="3"] выведет 3 последние записи.

Советы по безопасности и оптимизации для shortcode

При создании shortcode нужно помнить про безопасность. Всегда фильтруйте входящие данные с помощью shortcode_atts и экранируйте вывод с помощью функций типа esc_html, esc_url или wp_kses_post.

Не стоит делать тяжелые запросы к базе данных в shortcode без кэширования — это может замедлить загрузку страниц. Если планируется сложная логика, лучше использовать transient API для кеширования результатов.

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

Бесплатные плагины для создания и управления shortcode

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

• Shortcoder — позволяет создавать собственные shortcode с HTML, JavaScript и PHP кодом.
• Custom Content Shortcode — удобен для создания динамического контента с параметрами.
• Shortcodes Ultimate — набор из более чем 50 готовых shortcode с возможностью кастомизации.

Все эти плагины доступны в репозитории WordPress и подходят для начинающих и опытных пользователей.

Как отлаживать и тестировать shortcode

Для проверки работы shortcode можно использовать несколько подходов. Во-первых, выводить результат через var_dump или error_log в коде функции. Во-вторых, использовать WP_DEBUG режим для выявления ошибок.

Рекомендуется тестировать shortcode в разных местах — в записях, страницах, виджетах — чтобы убедиться, что они корректно работают везде.

Если shortcode не работает, проверьте, не конфликтует ли он с другими плагинами, и правильно ли зарегистрирована функция через add_shortcode.

Заключение

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

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