如何为 WOOF 中的每个类别显示不同的筛选器（动态筛选）

了解如何根据产品类别显示不同的过滤器集，创建依赖性过滤，以及为 WooCommerce 商店页面自定义过滤器。

问题

默认情况下，WOOF 在所有页面上显示相同的过滤器。但是，不同的产品类别通常需要不同的过滤选项：

示例场景：

电子产品类别： 显示品牌、屏幕尺寸、存储、RAM
服装类别： 显示尺码、颜色、材质、款式
Furniture category: 显示材质、颜色、尺寸、房间类型
商店页面（主存档）： 仅显示类别、价格范围、精选品牌

当前限制： 所有筛选器选项仍然是全局的，即使在用户选择了类别之后，这也会导致界面充斥着不相关的筛选器。

你将学到：

如何启用依赖/条件过滤（过滤器根据选择更新）
如何为每个产品类别显示不同的过滤器
如何为商店页面创建自定义过滤器集
如何使用 Widget Logic 进行高级可见性控制

解决方案 1：启用依赖性过滤（AJAX 重绘）

第一步是启用 AJAX 表单重绘，它会在用户进行选择时动态更新过滤器。

对于小部件：

前往 外观 → 小工具
找到您的 WOOF 小工具
启用该选项 “表单 AJAX 重新绘制”

这使得过滤器在每次选择后自动更新，仅显示相关的选项。

对于简码：

添加 ajax_redraw 添加到你的 WOOF 短代码：

[woof ajax_redraw="1"]

其功能：

当用户选择“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：使用短代码

Replace your existing [woof] 短代码：

[woof_dynamic]

将此短代码放在：

小部件区域（文本/HTML 小部件）
页面构建器块（Elementor、Divi 等）
主题模板文件： <?php echo do_shortcode('[woof_dynamic]'); ?>

步骤 3：配置您的分类

更新 $filters_map array with your actual:

分类蛞蝓 (例如，“wheel”、“electronics”)
属性 Slug (例如，‘pa_brand’, ‘pa_size’)

查找您的 slug：

分类斜杠：

前往 Products → Categories
Hover over a category name
查看 URL： ...tag_ID=123&taxonomy=product_cat&post_type=product
或编辑类别并查看 slug 字段

属性蛞蝓：

前往 商品 → 属性
它们以 pa_ 后面跟着属性名称
示例： pa_color, pa_size, pa_brand, pa_material

解决方案 3：商店页面的自定义过滤器

主 WooCommerce 商店页面需要不同的处理方式，因为它不是一个分类存档。

组合解决方案：商店页面 + 类别页面

此代码同时处理 Shop 页面和单个类别页面：

/**
 * 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"]');
});

This code does:

On Shop page: 仅显示类别、颜色和价格过滤器
在分类页面上： 显示映射中的特定分类过滤器
在其他页面： 显示默认过滤器

自定义商店页面过滤器： 更改此行可在商店页面上显示不同的过滤器：

[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 插件

选择以下插件之一：

Widget Logic： https://wordpress.org/plugins/widget-logic/
按逻辑显示小部件： https://github.com/realmag777/Show-WordPress-Widget-by-Logic

步骤 2：创建多个 WOOF 小部件

前往 外观 → 小工具
将多个 WOOF 小部件添加到您的侧边栏
为每个小部件配置不同的过滤器

Step 3: Add Conditional Logic

对于每个小部件，添加可见性条件：

Show only on Wheel category:

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()

Show on Electronics or Computers categories:

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

Real-World Examples

Example 1: Adult Products Store

$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'],
];

Advanced: Include Price and Categories

If you want to show price range and categories in addition to attributes:

// 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" – Shows price range slider
ajax_redraw="1" – 动态更新过滤器

故障排除

过滤器未动态更新

Problem: 选择后过滤器保持静态
解决方案：

确保 ajax_redraw="1" 在您的短代码中
在小部件设置中启用“表单 AJAX 重绘”
检查 JavaScript 控制台以查找错误

类别显示错误的过滤器

Problem: 分类显示过滤器设置不正确
解决方案：

验证分类的 slug 是否正确（检查 URL 或分类设置）
使用小写字母 $filters_map 数组
检查类别是否在您的映射中

Filters not appearing at all

Problem: 页面上没有可见的过滤器
解决方案：

Verify attribute slugs start with pa_ (例如， pa_color 不 color)
检查属性是否已分配给该类别中的产品
使用 [woof] 暂时查看基本短代码是否正常工作

商店页面显示分类过滤器

Problem: 店铺页面显示错误的过滤器集
解决方案：

Verify is_shop() condition 位于您的代码的开头
检查 !is_product_category() is included
清除所有缓存（WordPress、服务器、浏览器）

属性 slug 不起作用

Problem: 特定属性过滤器未显示
解决方案：

前往 商品 → 属性 查找正确的 slug
Remember to use pa_ 前缀（WooCommerce 要求）
检查拼写： pa_colour vs pa_color

添加代码后代码不起作用

Problem: 添加代码后出现白屏或错误
解决方案：

在错误日志中检查 PHP 语法错误
确保您正在编辑子主题的 functions.php
验证所有括号和引号是否已关闭
逐行删除代码并重新添加

性能注意事项

AJAX 重绘影响：

每个选择都会触发 AJAX 请求
更多产品 = 更长的响应时间
Solution: Use caching and optimize database

Multiple widgets vs. shortcode:

小部件：更多内存使用（所有小部件加载）
短代码：更高效（仅加载一个集合）
建议：使用简码方法

大型目录：

考虑筛选器中的分页
对属性使用延迟加载
Implement server-side caching

Alternative Approaches

使用多个短代码

使用多个静态短代码，而不是一个动态短代码：

// 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]');
}
?>

Summary

Problem: 相同的过滤器显示在所有地方，弄乱界面

解决方案 1： 启用 AJAX 重绘以进行依赖性过滤

解决方案 2： Create [woof_dynamic] 带有类别映射的 shortcode

解决方案 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
});

这将创建一个专业、用户友好的过滤体验，根据每个产品类别量身定制。