HUSKY - Products Filter Professional for WooCommerce

Como Mostrar Filtros Diferentes por Categoria no WOOF (Filtragem Dinâmica)

Saiba como exibir diferentes conjuntos de filtros com base nas categorias de produtos, criar filtragem dependente e personalizar filtros para a página da loja WooCommerce.

O Problema

Por padrão, o WOOF mostra os mesmos filtros em todas as páginas. No entanto, diferentes categorias de produtos geralmente precisam de opções de filtro diferentes:

Cenários de exemplo:

  • Categoria Eletrônicos: Mostrar Marca, Tamanho da Tela, Armazenamento, RAM
  • Categoria de Roupas: Mostrar Tamanho, Cor, Material, Estilo
  • Categoria Móveis: Mostrar Material, Cor, Dimensões, Tipo de Quarto
  • Página da loja (arquivo principal): Mostrar apenas Categorias, Faixa de Preços, Marcas em Destaque

Limitação atual: Todas as opções de filtro permanecem globais, mesmo após um usuário selecionar uma categoria, tornando a interface confusa com filtros irrelevantes.

O que você aprenderá:

  1. Como habilitar filtragem dependente/condicional (filtros atualizam com base na seleção)
  2. Como mostrar filtros diferentes por categoria de produto
  3. Como criar conjuntos de filtros personalizados para a página Loja
  4. Como usar Widget Logic para controle avançado de visibilidade

 

Solução 1: Habilitar Filtragem Dependente (Redesenho AJAX)

O primeiro passo é ativar o redesenho do formulário AJAX, que atualiza os filtros dinamicamente quando os usuários fazem seleções.

Para Widgets:

  1. Ir para Aparência → Widgets
  2. Encontre seu widget WOOF
  3. Habilite a opção “Redesenho AJAX do formulário”

Isso faz com que os filtros sejam atualizados automaticamente após cada seleção, mostrando apenas opções relevantes.

Para Shortcodes:

Adicione o ajax_redraw atributo ao seu shortcode WOOF:

[woof ajax_redraw="1"]

O que isso faz:

  • Quando o usuário seleciona "Roda" → outros filtros atualizam automaticamente
  • Mostra apenas Tipos Secundários, Materiais, Cores disponíveis para Roda
  • Reduz a desordem ocultando opções irrelevantes

Documentação: https://products-filter.com/shortcode/woof

 

Solução 2: Visibilidade de Filtro Baseada em Categoria (Shortcode Personalizado)

Esta solução cria um shortcode dinâmico que exibe diferentes filtros dependendo da categoria de produto atual.

 

Etapa 1: Criar Shortcode Personalizado

Adicione este código ao seu tema filho 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"]');
});

 

Passo 2: Use o Shortcode

Substitua o seu atual [woof] shortcode com:

[woof_dynamic]

Coloque este shortcode em:

  • Áreas de Widget (widget de Texto/HTML)
  • Blocos de construtor de páginas (Elementor, Divi, etc.)
  • Arquivos de template do tema: <?php echo do_shortcode('[woof_dynamic]'); ?>

 

Passo 3: Configure suas Categorias

Atualize o $filters_map array com seus reais:

  • Slugs de categoria (por exemplo, ‘roda’, ‘eletrônicos’)
  • Slugs de atributos (por exemplo, ‘pa_marca’, ‘pa_tamanho’)

Encontrando seus slugs:

Slugs de Categoria:

  • Ir para Produtos → Categorias
  • Passe o mouse sobre um nome de categoria
  • Olhe o URL: ...tag_ID=123&taxonomy=product_cat&post_type=product
  • Ou edite a categoria e olhe o campo slug

Slugs de atributos:

  • Ir para Produtos → Atributos
  • Eles começam com pa_ seguido pelo nome do atributo
  • Exemplos: pa_color, pa_size, pa_brand, pa_material

 

Solução 3: Filtros Personalizados para a Página da Loja

A página principal da Loja WooCommerce precisa de um tratamento diferente, pois não é um arquivo de categoria.

Solução Combinada: Página da Loja + Páginas de Categoria

Este código lida tanto com a página Loja quanto com páginas de categoria individuais:

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

O que este código faz:

  1. Na página da loja: Mostra apenas filtros de Categorias, Cores e Preço
  2. Nas páginas de categoria: Mostra filtros específicos da categoria a partir do mapeamento
  3. Em outras páginas: Mostra filtros padrão

Personalizar filtros da página Loja: Altere esta linha para mostrar filtros diferentes na página Loja:

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

Parâmetros disponíveis:

  • tax_only="product_cat,pa_brand" – Mostrar apenas estas taxonomias
  • by_price="1" – Mostrar filtro de faixa de preço
  • by_only="product_cat,pa_brand" – Alternativa a tax_only
  • ajax_redraw="1" – Habilitar atualizações dinâmicas

 

Solução 4: Widget Logic para Visibilidade Condicional

Se você prefere usar widgets em vez de shortcodes, pode controlar a visibilidade do widget com lógica condicional.

Passo 1: Instale o Plugin Widget Logic

Escolha um destes plugins:

 

Passo 2: Crie Múltiplos Widgets WOOF

  1. Ir para Aparência → Widgets
  2. Adicione múltiplos widgets WOOF à sua barra lateral
  3. Configure cada widget com filtros diferentes

Passo 3: Adicionar Lógica Condicional

Para cada widget, adicione condições de visibilidade:

Mostrar apenas na categoria Roda:

is_product_category('wheel')

Mostrar apenas na categoria Lingerie:

is_product_category('lingerie')

Mostrar apenas na página Loja:

is_shop() AND !is_product_category()

Mostrar em várias categorias:

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

Mostrar em todos os lugares, exceto na página da Loja:

!is_shop()

Mostrar nas categorias Eletrônicos ou Computadores:

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

Exemplos do Mundo Real

Exemplo 1: Loja de Produtos Adultos

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

 

Exemplo 2: Loja de Eletrônicos

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

 

Exemplo 3: Loja de Moda

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

 

Exemplo 4: Loja de Móveis

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

 

Avançado: Incluir Preço e Categorias

Se você quiser mostrar a faixa de preço e as categorias além dos atributos:

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

Explicação dos parâmetros:

  • product_cat – Mostra o filtro de categoria para drill-down
  • by_price="1" – Mostra o slider de faixa de preço
  • ajax_redraw="1" – Atualiza filtros dinamicamente

Solução de Problemas

Filtros não atualizando dinamicamente

Problema: Filtros permanecem estáticos após a seleção
Solução:

  • Certifique-se ajax_redraw="1" está no seu shortcode
  • Ativar “Redesenho AJAX do formulário” nas configurações do widget
  • Verifique o console JavaScript em busca de erros

Filtros errados mostrando na categoria

Problema: Categoria mostra conjunto de filtro incorreto
Solução:

  • Verifique se o slug da categoria está correto (verifique a URL ou as configurações da categoria)
  • Use letras minúsculas em $filters_map array
  • Verifique se a categoria existe no seu mapeamento

Filtros não aparecendo

Problema: Nenhum filtro visível na página
Solução:

  • Verifique se os slugs dos atributos começam com pa_ (por exemplo, pa_color não color)
  • Verifique se os atributos estão atribuídos aos produtos nessa categoria
  • Use [woof] temporariamente para ver se o shortcode básico funciona

A página da loja exibe filtros de categoria

Problema: A página da loja mostrando o conjunto de filtros errado
Solução:

  • Verificar is_shop() condição esteja primeiro em seu código
  • Verifique se !is_product_category() está incluído
  • Limpar todos os caches (WordPress, servidor, navegador)

Slugs de atributos não funcionam

Problema: Filtros não aparecendo para atributos específicos
Solução:

  • Ir para Produtos → Atributos para encontrar slugs corretos
  • Lembre-se de usar pa_ prefixo (requisito do WooCommerce)
  • Verifique a ortografia: pa_colour vs pa_color

Código não funciona após adicionar

Problema: Tela em branco ou erros após adicionar código
Solução:

  • Verifique os erros de sintaxe PHP no log de erros
  • Certifique-se de que você está editando o functions.php do tema filho
  • Verifique se todos os colchetes e aspas estão fechados
  • Remova o código e adicione-o de volta linha por linha

Considerações de Desempenho

Impacto de redesenho AJAX:

  • Cada seleção aciona uma solicitação AJAX
  • Mais produtos = maior tempo de resposta
  • Solução: Use cache e otimize o banco de dados

Múltiplos widgets vs. shortcode:

  • Widgets: Mais uso de memória (todos os widgets carregam)
  • Shortcode: Mais eficiente (apenas um conjunto carrega)
  • Recomendação: Use a abordagem de shortcode

Catálogos grandes:

  • Considere paginação nos filtros
  • Use carregamento preguiçoso para atributos
  • Implementar cache do lado do servidor

Abordagens Alternativas

Usando Múltiplos Shortcodes

Em vez de um shortcode dinâmico, use vários estáticos:

// 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"]

Então use Widget Logic para mostrar o shortcode correto em cada página.

Usando Arquivos de Template

Adicione lógica condicional diretamente no template do seu tema:

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

Resumo

Problema: Mesmos filtros exibidos em todos os lugares, poluindo a interface

Solução 1: Habilitar redesenho AJAX para filtragem dependente

Solução 2: Criar [woof_dynamic] shortcode com mapeamento de categoria

Solução 3: Adicionar tratamento da página da loja com filtros mínimos

Solução 4: Use Widget Logic para controle avançado de visibilidade

Melhor Abordagem: Combine as Soluções 2 + 3 para uma filtragem dinâmica abrangente

Código da Tecla:

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
});

Isso cria uma experiência de filtragem profissional e amigável, adaptada a cada categoria de produto.