Как использовать шорткоды в WooCommerce для расширения функционала на WPBegin

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

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

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

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

Например, шорткод [woocommerce_cart] выводит корзину покупок, а [products limit="4" columns="4"] — сетку из четырёх товаров.

Основные шорткоды WooCommerce: список и применение

Вот наиболее часто используемые шорткоды WooCommerce с кратким описанием:

• [woocommerce_cart] — выводит страницу корзины;
• [woocommerce_checkout] — страница оформления заказа;
• [woocommerce_my_account] — личный кабинет пользователя;
• [products] — вывод списка товаров с возможностью фильтрации;
• [product_category] — товары из конкретной категории;
• [add_to_cart id="123"] — кнопка добавления товара с ID 123 в корзину.

Каждый шорткод поддерживает набор атрибутов для настройки внешнего вида и содержимого. Например, шорткод [products] можно использовать так:

[products limit="8" columns="4" orderby="date" order="DESC" visibility="visible"]

Этот код отобразит 8 последних добавленных товаров в 4 колонки.

Кастомизация шорткодов WooCommerce через WPBegin_filter_custom_shortcode

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

Например, создадим шорткод [wpbegin_featured_products], который будет выводить избранные товары с кастомной разметкой:

function wpbegin_featured_products_shortcode( $atts ) {
    $atts = shortcode_atts( array(
        'limit' => 4,
        'columns' => 4,
    ), $atts, 'wpbegin_featured_products' );

    $args = array(
        'post_type' => 'product',
        'posts_per_page' => intval($atts['limit']),
        'meta_key' => '_featured',
        'meta_value' => 'yes',
        'post_status' => 'publish',
    );

    $loop = new WP_Query( $args );
    if ( ! $loop->have_posts() ) {
        return '<p>Избранных товаров нет.</p>';
    }

    $output = '<ul class="wpbegin-featured-products columns-' . intval($atts['columns']) . '">';
    while ( $loop->have_posts() ) {
        $loop->the_post();
        global $product;
        $output .= '<li class="product-item">';
        $output .= '<a href="' . get_permalink() . '">' . get_the_post_thumbnail( get_the_ID(), 'medium' ) . '</a>';
        $output .= '<h3><a href="' . get_permalink() . '">' . get_the_title() . '</a></h3>';
        $output .= '<span class="price">' . $product->get_price_html() . '</span>';
        $output .= '</li>';
    }
    wp_reset_postdata();
    $output .= '</ul>';

    return $output;
}
add_shortcode( 'wpbegin_featured_products', 'wpbegin_featured_products_shortcode' );

Этот код добавляет шорткод, который выводит избранные товары с миниатюрами, заголовками и ценой, оформленные в список с классами для стилизации.

Как использовать кастомный шорткод

Добавьте приведённый код в файл functions.php вашей темы или в плагин для кастомного кода. После этого вставьте в страницу или пост:

[wpbegin_featured_products limit="6" columns="3"]

Шорткод выведет 6 избранных товаров в 3 колонки.

Плагины для расширения шорткодов WooCommerce

Для тех, кто не хочет писать свой код, есть готовые решения в виде плагинов:

• WooCommerce Shortcodes Kit — добавляет дополнительные шорткоды и расширенные параметры для стандартных.
• Shortcodes Ultimate — универсальный плагин с поддержкой WooCommerce, позволяет вставлять кнопки, товары, категории и многое другое.
• Woo Shortcodes Kit — бесплатный плагин с удобным визуальным редактором для вставки шорткодов.

Использование таких плагинов ускоряет работу и упрощает настройку магазина.

Тонкости и советы по работе с шорткодами WooCommerce

При использовании шорткодов в WooCommerce стоит помнить несколько важных моментов:

• Некоторые шорткоды работают только на страницах с активным выводом WooCommerce (например, корзина и оформление заказа).
• Чтобы избежать конфликтов, лучше не использовать шорткоды внутри виджетов без проверки совместимости.
• Кастомные шорткоды нужно именовать уникально, лучше с префиксом, например, wpbegin_, чтобы избежать пересечений.
• Для сложной логики лучше создавать отдельные функции и подключать их через шорткод, чем писать длинные конструкции внутри атрибутов.

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

Пример стилизации

Для вышеописанного шорткода можно добавить в файл стилей темы:

.wpbegin-featured-products { display: flex; flex-wrap: wrap; gap: 15px; list-style: none; padding: 0; }
.wpbegin-featured-products.columns-3 .product-item { width: calc(33.33% - 10px); border: 1px solid #ddd; padding: 10px; box-sizing: border-box; }
.wpbegin-featured-products .product-item h3 { font-size: 1.1em; margin: 10px 0 5px; }
.wpbegin-featured-products .price { color: #0073aa; font-weight: bold; }

Это сделает список товаров в 3 колонки с отступами и простой рамкой.

Выводы

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