Создание и использование shortcode в WordPress: подробное руководство с примерами кода

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

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

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

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

• Вывод кастомных форм или кнопок.
• Встраивание сложных элементов (карты, таблицы, слайдеры).
• Реализация динамического контента с параметрами.

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

Как создать свой shortcode: базовый пример

Для создания шорткода нужно зарегистрировать его с помощью функции add_shortcode(). В качестве обработчика передаётся функция, возвращающая HTML-код для вывода.

Рассмотрим простой пример для сайта wporders.ru — создадим шорткод, который будет выводить приветствие и текущую дату:

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

    $date = date('d.m.Y');
    return '<p>Здравствуйте, ' . esc_html($atts['name']) . '! Сегодня ' . $date . '.</p>';
}
add_shortcode('wporders_hello', 'wporders_hello_shortcode');

Теперь в тексте можно использовать [wporders_hello name="Иван"], и пользователь увидит: Здравствуйте, Иван! Сегодня 27.04.2024.

Функция shortcode_atts() помогает задать параметры по умолчанию и получить значения, переданные в шорткоде. Это стандартный способ обработки атрибутов.

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

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

Пример функции для вывода заказов пользователя:

function wporders_user_orders_shortcode($atts) {
    if (!is_user_logged_in()) {
        return '<p>Пожалуйста, войдите, чтобы увидеть свои заказы.</p>';
    }

    $user_id = get_current_user_id();
    $args = array(
        'customer_id' => $user_id,
        'limit' => 5,
        'orderby' => 'date',
        'order' => 'DESC',
    );
    $orders = wc_get_orders($args);

    if (empty($orders)) {
        return '<p>Заказы не найдены.</p>';
    }

    $output = '<ul class="wporders-user-orders">';
    foreach ($orders as $order) {
        $order_date = $order->get_date_created()->date('d.m.Y');
        $order_total = $order->get_formatted_order_total();
        $order_link = $order->get_view_order_url();

        $output .= '<li><a href="' . esc_url($order_link) . '">Заказ #' . $order->get_id() . '</a> от ' . $order_date . ' на сумму ' . $order_total . '</li>';
    }
    $output .= '</ul>';

    return $output;
}
add_shortcode('wporders_user_orders', 'wporders_user_orders_shortcode');

Используйте шорткод [wporders_user_orders] на странице, чтобы вывести список последних 5 заказов текущего пользователя. Если пользователь не авторизован — появится сообщение с приглашением войти.

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

Функция проверяет, залогинен ли пользователь, получает ID, затем с помощью wc_get_orders() выбирает заказы. Для каждого заказа выводится ссылка, дата и сумма. Это типичный пример интеграции шорткодов с WooCommerce.

Динамические параметры шорткода: сортировка и количество заказов

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

function wporders_user_orders_shortcode($atts) {
    if (!is_user_logged_in()) {
        return '<p>Пожалуйста, войдите, чтобы увидеть свои заказы.</p>';
    }

    $atts = shortcode_atts(array(
        'limit' => 5,
        'orderby' => 'date',
        'order' => 'DESC'
    ), $atts, 'wporders_user_orders');

    $user_id = get_current_user_id();
    $args = array(
        'customer_id' => $user_id,
        'limit' => intval($atts['limit']),
        'orderby' => sanitize_text_field($atts['orderby']),
        'order' => sanitize_text_field($atts['order']),
    );

    $orders = wc_get_orders($args);

    if (empty($orders)) {
        return '<p>Заказы не найдены.</p>';
    }

    $output = '<ul class="wporders-user-orders">';
    foreach ($orders as $order) {
        $order_date = $order->get_date_created()->date('d.m.Y');
        $order_total = $order->get_formatted_order_total();
        $order_link = $order->get_view_order_url();

        $output .= '<li><a href="' . esc_url($order_link) . '">Заказ #' . $order->get_id() . '</a> от ' . $order_date . ' на сумму ' . $order_total . '</li>';
    }
    $output .= '</ul>';

    return $output;
}
add_shortcode('wporders_user_orders', 'wporders_user_orders_shortcode');

Теперь можно использовать, например, [wporders_user_orders limit="10" orderby="id" order="ASC"] для вывода 10 заказов с сортировкой по ID в порядке возрастания.

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

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

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

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

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

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

• Используйте функции esc_html(), esc_url() и другие для очистки вывода.
• Проверяйте права доступа пользователя, чтобы не показывать приватную информацию.
• Минимизируйте запросы к базе данных и кэшируйте результаты, если шорткод вызывается часто.

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

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

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

Правильно написанный шорткод — это легкий и безопасный инструмент расширения возможностей сайта. Используйте примеры из статьи, чтобы создавать свои решения под задачи проекта wporders.ru и других сайтов на WordPress.