Как показать категории WooCommerce на странице ‘магазин’ вместо продуктов?

Вопрос или проблема

Настройка

Я использую:

  • WordPress 5.4.1
  • WooCommerce 4.1.1

Я пишу свою собственную тему, которая переопределяет некоторые шаблоны WooCommerce, располагая свои собственные шаблоны в: themes/my_theme/woocommerce/template-name.php

Я установил, что страница магазина (первая страница) использует archive-product.php и успешно скопировал ее из plugins/woocommerce/templates/archive-product.php в свою тему и внес некоторые незначительные изменения в HTML, которые работают нормально. В копии моего шаблона нет функциональных изменений, только изменения в HTML.

Проблема

Есть опция установить страницу магазина для отображения категорий вместо продуктов:

Внешний вид > Настроить > WooCommerce > Каталог

Отображение страницы магазина теперь установлено на Показать категории

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

Как мне найти эту настройку и затем отобразить категории (в виде миниатюр) на главной странице магазина?


Кстати, тема Storefront учитывает настройку, но у них нет шаблона archive-product.php. Все в Storefront сильно запутано, и после долгого отладки и попыток разобрать его я не могу выяснить, какой файл шаблона используется для страницы магазина.

Я нашел рабочее решение. Шаблоны по умолчанию WooCommerce не поддерживают настройку для отображения категорий на странице магазина.

Однако, используя шорткод с do_shortcode() и условие, это можно реализовать следующим образом:

if (is_shop()) {

  echo do_shortcode('[product_categories hide_empty="0"]');

} else {

  woocommerce_product_loop_start();

  if ( wc_get_loop_prop( 'total' ) ) {
    while ( have_posts() ) {
      the_post();

      /**
      * Хук: woocommerce_shop_loop.
      */
      do_action( 'woocommerce_shop_loop' );

      wc_get_template_part( 'content', 'product' );
    }

  }

  woocommerce_product_loop_end();
}

Тем не менее:

  • Я хотел бы знать, как получить настройку ‘показать категории’, показанную в вопросе, чтобы моя тема на это реагировала.
  • Есть ли лучший способ, чем использовать do_shortcode(), это кажется немного временным решением.

Ответ или решение

Как отобразить категории WooCommerce на странице «магазин» вместо продуктов

Введение

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

Шаг 1: Изучение текущих настроек

Вы уже сделали правильное решение, установив в настройках WooCommerce параметр отображения категорий на странице магазина:
Внешний вид > Настроить > WooCommerce > Каталог и выбрали Показать категории.

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

Шаг 2: Копирование шаблона

Вы правильно скопировали файл archive-product.php из папки плагина WooCommerce в ваш кастомный шаблон. Это позволяет вам вносить изменения и управлять тем, как ваши продукты отображаются в магазине.

Шаг 3: Реализация функционала

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

if ( is_shop() ) {
    echo do_shortcode('[product_categories hide_empty="0"]');
} else {
    woocommerce_product_loop_start();

    if ( wc_get_loop_prop( 'total' ) ) {
        while ( have_posts() ) {
            the_post();
            do_action( 'woocommerce_shop_loop' );
            wc_get_template_part( 'content', 'product' );
        }
    }

    woocommerce_product_loop_end();
}

Этот код позволит вам вывести категории на странице магазина, используя шорткод.

Шаг 4: Улучшение и получение настройки

Чтобы ваша тема реагировала на настройки, выполненные в WooCommerce, вам нужно использовать функцию get_option() для получения значения, сохраненного в настройках. Вы можете сделать это следующим образом:

if ( is_shop() ) {
    $shop_display = get_option('woocommerce_shop_page_display'); // Получаем установку для страницы магазина

    if ( $shop_display === 'show_categories' ) {
        echo do_shortcode('[product_categories hide_empty="0"]');
    } else {
        // Логика для показа продуктов
        woocommerce_product_loop_start();
        // ...
        woocommerce_product_loop_end();
    }
}

Шаг 5: Поиск лучше решения

Учитывая, что использование do_shortcode() может ощущаться как «хак», рассмотрим возможность создания собственного WP_Query для получения категорий. Это обеспечит более высокую гибкость и будет менее зависеть от механизмов шорткодов. Пример использования WP_Query может выглядеть так:

if ( is_shop() ) {
    $args = array(
        'taxonomy'   => 'product_cat',
        'hide_empty' => false,
    ); 
    $categories = get_terms($args);

    if (!empty($categories) && !is_wp_error($categories)) {
        echo '<ul class="product-categories">';
        foreach ($categories as $category) {
            $category_link = get_term_link($category);
            echo '<li><a href="' . esc_url($category_link) . '">' . esc_html($category->name) . '</a></li>';
        }
        echo '</ul>';
    }
}

Заключение

Реализация отображения категорий на странице «магазин» WooCommerce может быть легко достигнута через указанные выше методы. Включение проверки настройки делает ваше решение более адаптивным. Использование WP_Query для получения категорий более эффективно и избавляет от потенциальных рисков производительности, связанных с шорткодами. Надеюсь, данное руководство было информативным и поможет вам в вашей разработке.

Оцените материал
Добавить комментарий

Капча загружается...