HUSKY - Products Filter Professional for WooCommerce

Как показывать разные фильтры для каждой категории в WOOF (динамическая фильтрация)

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

Проблема

По умолчанию WOOF показывает одинаковые фильтры на всех страницах. Однако разным категориям товаров часто нужны разные опции фильтра:

Примеры сценариев:

  • Категория электроники: Показывать Бренд, Размер экрана, Память, ОЗУ
  • Категория одежды: Показывать Размер, Цвет, Материал, Стиль
  • Категория мебели: Показывать Материал, Цвет, Размеры, Тип комнаты
  • Страница магазина (главный архив): Показывать только Категории, Диапазон цены, Рекомендуемые бренды

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

Что вы узнаете:

  1. Как включить зависимую/условную фильтрацию (фильтры обновляются в зависимости от выбора)
  2. Как показывать разные фильтры для каждой категории товаров
  3. Как создать собственные наборы фильтров для страницы магазина
  4. Как использовать Widget Logic для расширенного управления видимостью

 

Решение 1: включить зависимую фильтрацию (AJAX Redraw)

Первый шаг — включить перерисовку формы через AJAX, которая динамически обновляет фильтры при выборе пользователем.

Для виджетов:

  1. Перейдите в Appearance → Widgets
  2. Найдите ваш виджет WOOF
  3. Включите опцию “Form AJAX redrawing”

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

Для шорткодов:

Добавьте атрибут ajax_redraw в ваш шорткод WOOF:

[woof ajax_redraw="1"]

Что это делает:

  • Когда пользователь выбирает “Wheel” → другие фильтры автоматически обновляются
  • Показывает только подтипы, материалы, цвета, доступные для Wheel
  • Уменьшает загруженность интерфейса, скрывая нерелевантные опции

Документация: https://products-filter.com/shortcode/woof

 

Решение 2: видимость фильтра по категориям (пользовательский шорткод)

Это решение создаёт динамический шорткод, который показывает разные фильтры в зависимости от текущей категории товаров.

 

Шаг 1: создайте пользовательский шорткод

Добавьте этот код в functions.php вашей дочерней темы:

/**
 * Dynamic WOOF shortcode that shows different filters per category
 * Usage: [woof_dynamic]
 */
add_shortcode('woof_dynamic', function () {
    // Check if WOOF is active
    if (!function_exists('woof_shortcode')) {
        return '<!-- WOOF plugin not active -->';
    }

    // Get current category
    $term = get_queried_object();

    // Check if we're on a product category page
    if (!$term || !isset($term->taxonomy) || $term->taxonomy !== 'product_cat') {
        return do_shortcode('[woof]'); // Show default filters
    }

    // Get category slug
    $cat = strtolower($term->slug);

    // Define which filters to show for each category
    $filters_map = [
        'wheel' => ['pa_sub-type', 'pa_material', 'pa_colour', 'pa_size'],
        'lingerie' => ['pa_size', 'pa_colour', 'pa_material'],
        'massage-candles' => ['pa_type', 'pa_material', 'pa_brand'],
        'electronics' => ['pa_brand', 'pa_screen-size', 'pa_storage'],
        'clothing' => ['pa_size', 'pa_color', 'pa_material', 'pa_style'],
        'furniture' => ['pa_material', 'pa_color', 'pa_dimensions', 'pa_room'],
    ];

    // If category not in map, show default filters
    if (!isset($filters_map[$cat])) {
        return do_shortcode('[woof]');
    }

    // Build shortcode with specific filters for this category
    $taxonomies = implode(',', $filters_map[$cat]);

    return do_shortcode('[woof tax_only="' . esc_attr($taxonomies) . '" ajax_redraw="1"]');
});

 

Шаг 2: используйте шорткод

Замените существующий шорткод [woof] на:

[woof_dynamic]

Разместите этот шорткод в:

  • Областях виджетов (виджет Text/HTML)
  • Блоках конструктора страниц (Elementor, Divi и т.д.)
  • Файлах шаблонов темы: <?php echo do_shortcode('[woof_dynamic]'); ?>

 

Шаг 3: настройте ваши категории

Обновите массив $filters_map вашими фактическими:

  • Slug категорий (например, ‘wheel’, ‘electronics’)
  • Slug атрибутов (например, ‘pa_brand’, ‘pa_size’)

Как найти ваши slug:

Slug категорий:

  • Перейдите в Products → Categories
  • Наведите курсор на название категории
  • Посмотрите на URL: ...tag_ID=123&taxonomy=product_cat&post_type=product
  • Или отредактируйте категорию и посмотрите на поле slug

Slug атрибутов:

  • Перейдите в Products → Attributes
  • Они начинаются с pa_, за которым следует название атрибута
  • Примеры: pa_color, pa_size, pa_brand, pa_material

 

Решение 3: пользовательские фильтры для страницы магазина

Главная страница магазина WooCommerce требует другой обработки, так как она не является архивом категории.

Комбинированное решение: страница магазина + страницы категорий

Этот код обрабатывает как страницу магазина, так и отдельные страницы категорий:

/**
 * Dynamic WOOF shortcode with Shop page support
 * Shows minimal filters on Shop, full filters on categories
 */
add_shortcode('woof_dynamic', function () {
    if (!function_exists('woof_shortcode')) {
        return '';
    }

    // Shop page (main product archive) - show minimal filters
    if (is_shop() AND !is_product_category() AND !is_product_tag()) {
        return do_shortcode('[woof tax_only="product_cat,pa_colour" by_price="1" ajax_redraw="1"]');
    }

    // Product category pages - show category-specific filters
    $term = get_queried_object();
    if ($term AND isset($term->taxonomy) AND $term->taxonomy === 'product_cat') {
        $cat = strtolower($term->slug);

        // Define filters for each category
        $filters_map = [
            'wheel' => ['pa_sub-type', 'pa_material', 'pa_colour', 'pa_size'],
            'lingerie' => ['pa_size', 'pa_colour', 'pa_material'],
            'massage-candles' => ['pa_type', 'pa_material', 'pa_brand'],
            'electronics' => ['pa_brand', 'pa_screen-size', 'pa_storage'],
            'clothing' => ['pa_size', 'pa_color', 'pa_material', 'pa_style'],
        ];

        if (isset($filters_map[$cat])) {
            $taxonomies = implode(',', $filters_map[$cat]);
            return do_shortcode('[woof tax_only="' . esc_attr($taxonomies) . '" ajax_redraw="1"]');
        }
    }

    // Fallback - show all filters
    return do_shortcode('[woof ajax_redraw="1"]');
});

Что делает этот код:

  1. На странице магазина: Показывает только фильтры Категорий, Цвета и Цены
  2. На страницах категорий: Показывает фильтры, специфичные для категории, из карты соответствия
  3. На других страницах: Показывает фильтры по умолчанию

Настройка фильтров страницы магазина: Измените эту строку, чтобы показывать другие фильтры на странице магазина:

[woof tax_only="product_cat,pa_colour" by_price="1" ajax_redraw="1"]

Доступные параметры:

  • tax_only="product_cat,pa_brand" — Показывать только эти таксономии
  • by_price="1" — Показывать фильтр диапазона цены
  • by_only="product_cat,pa_brand" — Альтернатива tax_only
  • ajax_redraw="1" — Включить динамическое обновление

 

Решение 4: Widget Logic для условной видимости

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

Шаг 1: установите плагин Widget Logic

Выберите один из этих плагинов:

 

Шаг 2: создайте несколько виджетов WOOF

  1. Перейдите в Appearance → Widgets
  2. Добавьте несколько виджетов WOOF в сайдбар
  3. Настройте каждый виджет с разными фильтрами

Шаг 3: добавьте условную логику

Для каждого виджета добавьте условия видимости:

Показать только на категории Wheel:

is_product_category('wheel')

Показать только на категории Lingerie:

is_product_category('lingerie')

Показать только на странице магазина:

is_shop() AND !is_product_category()

Показать на нескольких категориях:

is_product_category(array('wheel', 'lingerie', 'massage-candles'))

Показать везде, кроме страницы магазина:

!is_shop()

Показать на категориях Electronics или Computers:

is_product_category('electronics') || is_product_category('computers')

Реальные примеры

Пример 1: магазин товаров для взрослых

$filters_map = [
    'wheel' => ['pa_type', 'pa_material', 'pa_color', 'pa_power-source', 'pa_waterproof'],
    'lingerie' => ['pa_size', 'pa_color', 'pa_style', 'pa_material'],
    'oil' => ['pa_type', 'pa_brand', 'pa_ingredients', 'pa_volume'],
    'toys' => ['pa_category', 'pa_material', 'pa_size', 'pa_color'],
];

 

Пример 2: магазин электроники

$filters_map = [
    'laptops' => ['pa_brand', 'pa_processor', 'pa_ram', 'pa_storage', 'pa_screen-size'],
    'smartphones' => ['pa_brand', 'pa_storage', 'pa_ram', 'pa_camera', 'pa_battery'],
    'headphones' => ['pa_brand', 'pa_type', 'pa_connection', 'pa_noise-cancelling'],
    'cameras' => ['pa_brand', 'pa_megapixels', 'pa_sensor-size', 'pa_video-quality'],
];

 

Пример 3: магазин одежды

$filters_map = [
    'mens-clothing' => ['pa_size', 'pa_color', 'pa_material', 'pa_brand', 'pa_style'],
    'womens-clothing' => ['pa_size', 'pa_color', 'pa_material', 'pa_brand', 'pa_occasion'],
    'shoes' => ['pa_size', 'pa_color', 'pa_brand', 'pa_type', 'pa_material'],
    'accessories' => ['pa_color', 'pa_material', 'pa_brand', 'pa_type'],
];

 

Пример 4: магазин мебели

$filters_map = [
    'bedroom' => ['pa_type', 'pa_material', 'pa_color', 'pa_style', 'pa_size'],
    'living-room' => ['pa_type', 'pa_material', 'pa_color', 'pa_seating-capacity'],
    'office' => ['pa_type', 'pa_material', 'pa_color', 'pa_ergonomic'],
    'outdoor' => ['pa_type', 'pa_material', 'pa_weather-resistant', 'pa_color'],
];

 

Дополнительно: включение цены и категорий

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

// On category pages, add price and allow category drill-down
if (isset($filters_map[$cat])) {
    $taxonomies = implode(',', $filters_map[$cat]);
    return do_shortcode('[woof tax_only="product_cat,' . esc_attr($taxonomies) . '" by_price="1" ajax_redraw="1"]');
}

Объяснение параметров:

  • product_cat — Показывает фильтр категории для углубления
  • by_price="1" — Показывает слайдер диапазона цены
  • ajax_redraw="1" — Динамически обновляет фильтры

Решение проблем

Фильтры не обновляются динамически

Проблема: Фильтры остаются статичными после выбора
Решение:

  • Убедитесь, что ajax_redraw="1" присутствует в шорткоде
  • Включите “Form AJAX redrawing” в настройках виджета
  • Проверьте консоль JavaScript на наличие ошибок

Неправильные фильтры показываются на категории

Проблема: Категория показывает неправильный набор фильтров
Решение:

  • Убедитесь, что slug категории правильный (проверьте URL или настройки категории)
  • Используйте нижний регистр в массиве $filters_map
  • Проверьте, есть ли категория в вашей карте соответствия

Фильтры вообще не появляются

Проблема: Никаких фильтров не видно на странице
Решение:

  • Убедитесь, что slug атрибутов начинаются с pa_ (например, pa_color, а не color)
  • Проверьте, привязаны ли атрибуты к товарам в этой категории
  • Временно используйте [woof], чтобы проверить, работает ли базовый шорткод

Страница магазина показывает фильтры категории

Проблема: Страница магазина показывает неправильный набор фильтров
Решение:

  • Убедитесь, что условие is_shop() стоит первым в вашем коде
  • Проверьте, включено ли !is_product_category()
  • Очистите все кэши (WordPress, сервер, браузер)

Slug атрибутов не работают

Проблема: Фильтры не показываются для конкретных атрибутов
Решение:

  • Перейдите в Products → Attributes, чтобы найти правильные slug
  • Не забывайте использовать префикс pa_ (требование WooCommerce)
  • Проверьте правописание: pa_colour против pa_color

Код не работает после добавления

Проблема: Белый экран или ошибки после добавления кода
Решение:

  • Проверьте синтаксические ошибки PHP в логе ошибок
  • Убедитесь, что вы редактируете functions.php дочерней темы
  • Убедитесь, что все скобки и кавычки закрыты
  • Удалите код и добавляйте его обратно построчно

Особенности производительности

Влияние AJAX redraw:

  • Каждый выбор запускает AJAX-запрос
  • Больше товаров = дольше время отклика
  • Решение: используйте кэширование и оптимизируйте базу данных

Несколько виджетов против шорткода:

  • Виджеты: больше потребление памяти (загружаются все виджеты)
  • Шорткод: более эффективно (загружается только один набор)
  • Рекомендация: используйте подход с шорткодом

Большие каталоги:

  • Рассмотрите пагинацию в фильтрах
  • Используйте ленивую загрузку для атрибутов
  • Реализуйте кэширование на стороне сервера

Альтернативные подходы

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

Вместо одного динамического шорткода используйте несколько статических:

// On wheel category page
[woof tax_only="pa_sub-type,pa_material,pa_colour,pa_size" ajax_redraw="1"]

// On Lingerie category page
[woof tax_only="pa_size,pa_colour,pa_material" ajax_redraw="1"]

// On Shop page
[woof tax_only="product_cat,pa_colour" by_price="1" ajax_redraw="1"]

Затем используйте Widget Logic для показа правильного шорткода на каждой странице.

Использование файлов шаблонов

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

<?php
if (is_product_category('books')) {
    echo do_shortcode('[woof tax_only="pa_sub-type,pa_material,pa_colour,pa_size"]');
} elseif (is_product_category('lingerie')) {
    echo do_shortcode('[woof tax_only="pa_size,pa_colour,pa_material"]');
} elseif (is_shop()) {
    echo do_shortcode('[woof tax_only="product_cat,pa_colour" by_price="1"]');
} else {
    echo do_shortcode('[woof]');
}
?>

Итог

Проблема: Одинаковые фильтры показываются везде, перегружая интерфейс

Решение 1: Включить AJAX redraw для зависимой фильтрации

Решение 2: Создать шорткод [woof_dynamic] с картой соответствия категорий

Решение 3: Добавить обработку страницы магазина с минимальными фильтрами

Решение 4: Использовать Widget Logic для расширенного управления видимостью

Лучший подход: Комбинировать Решения 2 + 3 для комплексной динамической фильтрации

Ключевой код:

add_shortcode('woof_dynamic', function() {
    // Shop page logic
    if (is_shop() AND !is_product_category()) {
        return do_shortcode('[woof tax_only="product_cat" by_price="1"]');
    }
    
    // Category mapping
    $term = get_queried_object();
    if ($term AND $term->taxonomy === 'product_cat') {
        $filters_map = [
            'category-slug' => ['pa_attribute1', 'pa_attribute2'],
        ];
        // Return category-specific filters
    }
    
    return do_shortcode('[woof]'); // Fallback
});

Это создаёт профессиональный, удобный опыт фильтрации, адаптированный под каждую категорию товаров.