Как создать динамический каталог товаров в WordPress с примерами кода

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

Почему стоит создавать динамический каталог товаров в WordPress?

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

Примером может служить каталог с использованием кастомных типов записей (Custom Post Types, CPT) и таксономий, что обеспечивает удобную структуру и расширяемость.

Создание кастомного типа записи для товаров

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

function wpupdate_register_product_cpt() {
    $labels = array(
        'name' => 'Товары',
        'singular_name' => 'Товар',
        'add_new' => 'Добавить товар',
        'add_new_item' => 'Добавить новый товар',
        'edit_item' => 'Редактировать товар',
        'new_item' => 'Новый товар',
        'all_items' => 'Все товары',
        'view_item' => 'Просмотреть товар',
        'search_items' => 'Поиск товаров',
        'not_found' => 'Товары не найдены',
        'not_found_in_trash' => 'В корзине товары не найдены',
        'menu_name' => 'Товары'
    );

    $args = array(
        'labels' => $labels,
        'public' => true,
        'has_archive' => true,
        'rewrite' => array('slug' => 'products'),
        'supports' => array('title', 'editor', 'thumbnail', 'custom-fields'),
        'show_in_rest' => true,
    );

    register_post_type('product', $args);
}
add_action('init', 'wpupdate_register_product_cpt');

Этот код регистрирует тип записи «Товар» с поддержкой миниатюр, редактора и пользовательских полей. Благодаря параметру show_in_rest можно использовать Gutenberg и REST API.

Добавление таксономий для удобной фильтрации товаров

Для удобства пользователей стоит добавить таксономии, например, «Категории товаров» и «Бренды». Это позволит сгруппировать товары и реализовать фильтры на фронтенде.

function wpupdate_register_product_taxonomies() {
    register_taxonomy('product_category', 'product', array(
        'labels' => array(
            'name' => 'Категории товаров',
            'singular_name' => 'Категория товара',
            'search_items' => 'Поиск категорий',
            'all_items' => 'Все категории',
            'edit_item' => 'Редактировать категорию',
            'add_new_item' => 'Добавить новую категорию',
            'menu_name' => 'Категории'
        ),
        'hierarchical' => true,
        'show_in_rest' => true,
        'rewrite' => array('slug' => 'product-category'),
    ));

    register_taxonomy('brand', 'product', array(
        'labels' => array(
            'name' => 'Бренды',
            'singular_name' => 'Бренд',
            'search_items' => 'Поиск брендов',
            'all_items' => 'Все бренды',
            'edit_item' => 'Редактировать бренд',
            'add_new_item' => 'Добавить новый бренд',
            'menu_name' => 'Бренды'
        ),
        'hierarchical' => false,
        'show_in_rest' => true,
        'rewrite' => array('slug' => 'brand'),
    ));
}
add_action('init', 'wpupdate_register_product_taxonomies');

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

Вывод каталога товаров на странице с фильтрами

Динамический вывод каталога организуем с помощью WP_Query. Создадим шаблон или шорткод, который будет принимать параметры фильтрации и выводить товары.

function wpupdate_products_catalog_shortcode($atts) {
    $atts = shortcode_atts(array(
        'category' => '',
        'brand' => '',
        'posts_per_page' => 12,
        'paged' => 1
    ), $atts, 'wpupdate_products_catalog');

    $tax_query = array('relation' => 'AND');

    if (!empty($atts['category'])) {
        $tax_query[] = array(
            'taxonomy' => 'product_category',
            'field' => 'slug',
            'terms' => explode(',', $atts['category'])
        );
    }

    if (!empty($atts['brand'])) {
        $tax_query[] = array(
            'taxonomy' => 'brand',
            'field' => 'slug',
            'terms' => explode(',', $atts['brand'])
        );
    }

    $query_args = array(
        'post_type' => 'product',
        'posts_per_page' => intval($atts['posts_per_page']),
        'paged' => intval($atts['paged']),
        'tax_query' => $tax_query
    );

    $query = new WP_Query($query_args);

    ob_start();

    if ($query->have_posts()) {
        echo '<div class="wpupdate-products-catalog">';
        while ($query->have_posts()) {
            $query->the_post();
            $price = get_post_meta(get_the_ID(), 'price', true);
            echo '<div class="wpupdate-product-item">';
            if (has_post_thumbnail()) {
                echo '<div class="wpupdate-product-thumb"><a href="' . get_permalink() . '">' . get_the_post_thumbnail(get_the_ID(), 'medium') . '</a></div>';
            }
            echo '<h3 class="wpupdate-product-title"><a href="' . get_permalink() . '">' . get_the_title() . '</a></h3>';
            if ($price) {
                echo '<div class="wpupdate-product-price">Цена: ' . esc_html($price) . ' ₽</div>';
            }
            echo '</div>';
        }
        echo '</div>';

        // Пагинация
        $big = 999999999;
        echo paginate_links(array(
            'base' => str_replace($big, '%#%', esc_url(get_pagenum_link($big))),
            'format' => '?paged=%#%',
            'current' => max(1, $atts['paged']),
            'total' => $query->max_num_pages
        ));
    } else {
        echo '<p>Товары не найдены.</p>';
    }

    wp_reset_postdata();

    return ob_get_clean();
}
add_shortcode('wpupdate_products_catalog', 'wpupdate_products_catalog_shortcode');

Пример использования шорткода на странице: [wpupdate_products_catalog category="electronics" brand="sony" posts_per_page="8"]

Этот код выводит товары из категории "electronics" и бренда "sony", по 8 штук на страницу с пагинацией.

Добавление пользовательских полей для товаров

Для хранения дополнительных данных, например, цены, артикулов, наличия, можно использовать пользовательские поля (Custom Fields). В WordPress это реализуется с помощью функции add_post_meta и update_post_meta. Для удобства добавления полей в админке рекомендую использовать бесплатный плагин Clearfy или аналогичные.

Например, чтобы получить цену товара в шаблоне, используйте:

$price = get_post_meta(get_the_ID(), 'price', true);

Оптимизация и производительность каталога

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

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

function wpupdate_get_products_with_cache($args) {
    $cache_key = 'wpupdate_products_' . md5(serialize($args));
    $cached = get_transient($cache_key);
    if ($cached !== false) {
        return $cached;
    }

    $query = new WP_Query($args);
    set_transient($cache_key, $query, 3600); // кеш на 1 час
    return $query;
}

Такой подход значительно уменьшит нагрузку на сервер при частых обращениях.

Интеграция с популярными плагинами и темами

Если у вас уже есть тема из набора Root или Bono, можно интегрировать созданный каталог с их стилями и функционалом. Также плагины, такие как WPRemark помогут добавить отзывы к товарам, а ABC Pagination улучшит навигацию по каталогам.

Выводы и дальнейшие шаги

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

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