HUSKY - Product Filter for WooCommerce

Come mostrare diversi filtri WooCommerce per categoria (filtraggio dinamico)

Scopri come visualizzare diversi set di filtri in base alle categorie di prodotti, creare filtri dipendenti e personalizzare i filtri per la pagina Shop di WooCommerce.

Il Problema

Per impostazione predefinita, WOOF mostra gli stessi filtri su tutte le pagine. Tuttavia, diverse categorie di prodotti spesso necessitano di opzioni di filtro differenti:

Esempi di scenari:

  • Categoria Elettronica: Mostra Marca, Dimensione Schermo, Archiviazione, RAM
  • Categoria Abbigliamento: Mostra Taglia, Colore, Materiale, Stile
  • Categoria Arredamento: Mostra Materiale, Colore, Dimensioni, Tipo di Stanza
  • Pagina Shop (archivio principale): Mostra solo Categorie, Fascia di Prezzo, Marche in evidenza

Limitazione attuale: Tutte le opzioni di filtro rimangono globali, anche dopo che un utente seleziona una categoria, rendendo l'interfaccia confusa con filtri irrilevanti.

Cosa imparerai:

  1. Come abilitare il filtro dipendente/condizionale (i filtri si aggiornano in base alla selezione)
  2. Come mostrare filtri diversi per categoria di prodotto
  3. Come creare set di filtri personalizzati per la pagina Shop
  4. Come utilizzare Widget Logic per il controllo avanzato della visibilità

 

Soluzione 1: Abilita il Filtro Dipendente (Ridisegno AJAX)

Il primo passo è abilitare il ridisegno del modulo AJAX, che aggiorna dinamicamente i filtri quando gli utenti effettuano selezioni.

Per i Widget:

  1. Vai su Aspetto → Widget
  2. Trova il tuo widget WOOF
  3. Abilita l'opzione “Form AJAX redrawing”

Questo fa sì che i filtri si aggiornino automaticamente dopo ogni selezione, mostrando solo le opzioni pertinenti.

Per gli Shortcode:

Aggiungi l'attributo ajax_redraw al tuo shortcode WOOF:

[woof ajax_redraw="1"]

Cosa fa:

  • Quando l'utente seleziona “Wheel” → gli altri filtri si aggiornano automaticamente
  • Mostra solo Sotto-tipi, Materiali, Colori disponibili per Wheel
  • Riduce il disordine nascondendo le opzioni irrilevanti

Documentazione: https://products-filter.com/shortcode/woof

 

Soluzione 2: Visibilità dei Filtri Basata sulle Categorie (Shortcode Personalizzato)

Questa soluzione crea uno shortcode dinamico che mostra filtri diversi a seconda della categoria di prodotto corrente.

 

Passo 1: Crea Shortcode Personalizzato

Aggiungi questo codice al functions.php del tuo tema child:

/**
 * 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: Usa lo Shortcode

Sostituisci il tuo shortcode esistente [woof] con:

[woof_dynamic]

Inserisci questo shortcode in:

  • Aree widget (widget Testo/HTML)
  • Blocchi page builder (Elementor, Divi, ecc.)
  • File template del tema: <?php echo do_shortcode('[woof_dynamic]'); ?>

 

Passo 3: Configura le Tue Categorie

Aggiorna l'array $filters_map con i tuoi valori effettivi:

  • Slug delle categorie (es., ‘wheel’, ‘electronics’)
  • Slug degli attributi (es., ‘pa_brand’, ‘pa_size’)

Come trovare i tuoi slug:

Slug delle categorie:

  • Vai su Prodotti → Categorie
  • Passa il mouse su un nome di categoria
  • Guarda l'URL: ...tag_ID=123&taxonomy=product_cat&post_type=product
  • Oppure modifica la categoria e guarda il campo slug

Slug degli attributi:

  • Vai su Prodotti → Attributi
  • Iniziano con pa_ seguiti dal nome dell'attributo
  • Esempi: pa_color, pa_size, pa_brand, pa_material

 

Soluzione 3: Filtri Personalizzati per la Pagina Shop

La pagina Shop principale di WooCommerce richiede una gestione diversa poiché non è un archivio di categorie.

Soluzione Combinata: Pagina Shop + Pagine Categoria

Questo codice gestisce sia la pagina Shop che le pagine categoria individuali:

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

Cosa fa questo codice:

  1. Sulla pagina Shop: Mostra solo i filtri Categorie, Colore e Prezzo
  2. Sulle pagine categoria: Mostra filtri specifici per categoria dal mapping
  3. Su altre pagine: Mostra filtri predefiniti

Personalizza i filtri della pagina Shop: Modifica questa riga per mostrare filtri diversi sulla pagina Shop:

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

Parametri disponibili:

  • tax_only="product_cat,pa_brand" – Mostra solo queste tassonomie
  • by_price="1" – Mostra filtro fascia di prezzo
  • by_only="product_cat,pa_brand" – Alternativa a tax_only
  • ajax_redraw="1" – Abilita aggiornamenti dinamici

 

Soluzione 4: Widget Logic per la Visibilità Condizionale

Se preferisci usare widget invece di shortcode, puoi controllare la visibilità dei widget con la logica condizionale.

Passo 1: Installa il Plugin Widget Logic

Scegli uno di questi plugin:

 

Passo 2: Crea Più Widget WOOF

  1. Vai su Aspetto → Widget
  2. Aggiungi più widget WOOF alla tua sidebar
  3. Configura ogni widget con filtri diversi

Passo 3: Aggiungi la Logica Condizionale

Per ogni widget, aggiungi condizioni di visibilità:

Mostra solo sulla categoria Wheel:

is_product_category('wheel')

Mostra solo sulla categoria Lingerie:

is_product_category('lingerie')

Mostra solo sulla pagina Shop:

is_shop() AND !is_product_category()

Mostra su più categorie:

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

Mostra ovunque tranne che sulla pagina Shop:

!is_shop()

Mostra sulle categorie Elettronica o Computer:

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

Esempi Reali

Esempio 1: Negozio di Prodotti per Adulti

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

 

Esempio 2: Negozio di Elettronica

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

 

Esempio 3: Negozio di 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'],
];

 

Esempio 4: Negozio di Arredamento

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

 

Avanzato: Includi Prezzo e Categorie

Se vuoi mostrare fascia di prezzo e categorie in aggiunta agli attributi:

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

Spiegazione dei parametri:

  • product_cat – Mostra filtro categoria per drill-down
  • by_price="1" – Mostra slider fascia di prezzo
  • ajax_redraw="1" – Aggiorna filtri dinamicamente

Risoluzione dei Problemi

I filtri non si aggiornano dinamicamente

Problema: I filtri rimangono statici dopo la selezione
Soluzione:

  • Assicurati che ajax_redraw="1" sia nel tuo shortcode
  • Abilita “Form AJAX redrawing” nelle impostazioni del widget
  • Controlla la console JavaScript per errori

Filtri errati mostrati sulla categoria

Problema: La categoria mostra un set di filtri errato
Soluzione:

  • Verifica che lo slug della categoria sia corretto (controlla URL o impostazioni categoria)
  • Usa minuscolo nell'array $filters_map
  • Controlla se la categoria esiste nel tuo mapping

I filtri non appaiono affatto

Problema: Nessun filtro visibile sulla pagina
Soluzione:

  • Verifica che gli slug degli attributi inizino con pa_ (es., pa_color non color)
  • Controlla se gli attributi sono assegnati ai prodotti in quella categoria
  • Usa temporaneamente [woof] per vedere se lo shortcode base funziona

La pagina Shop mostra filtri di categoria

Problema: La pagina Shop mostra un set di filtri errato
Soluzione:

  • Verifica che la condizione is_shop() sia per prima nel tuo codice
  • Controlla che !is_product_category() sia incluso
  • Pulisci tutte le cache (WordPress, server, browser)

Gli slug degli attributi non funzionano

Problema: I filtri non vengono mostrati per attributi specifici
Soluzione:

  • Vai su Prodotti → Attributi per trovare gli slug corretti
  • Ricorda di usare il prefisso pa_ (requisito di WooCommerce)
  • Controlla l'ortografia: pa_colour vs pa_color

Il codice non funziona dopo l'aggiunta

Problema: Schermata bianca o errori dopo l'aggiunta del codice
Soluzione:

  • Controlla gli errori di sintassi PHP nel registro errori
  • Assicurati di modificare il functions.php del tema child
  • Verifica che tutte le parentesi e le virgolette siano chiuse
  • Rimuovi il codice e aggiungilo di nuovo riga per riga

Considerazioni sulle Prestazioni

Impatto del ridisegno AJAX:

  • Ogni selezione attiva una richiesta AJAX
  • Più prodotti = tempo di risposta più lungo
  • Soluzione: Usa la cache e ottimizza il database

Widget multipli vs. shortcode:

  • Widget: Maggiore utilizzo di memoria (tutti i widget si caricano)
  • Shortcode: Più efficiente (si carica solo un set)
  • Raccomandazione: Usa l'approccio shortcode

Cataloghi grandi:

  • Considera la paginazione nei filtri
  • Usa il caricamento lento per gli attributi
  • Implementa la cache lato server

Approcci Alternativi

Usare Shortcode Multipli

Invece di uno shortcode dinamico, usane diversi statici:

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

Poi usa Widget Logic per mostrare lo shortcode corretto su ogni pagina.

Usare File Template

Aggiungi la logica condizionale direttamente nel template del 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]');
}
?>

Riepilogo

Problema: Gli stessi filtri vengono mostrati ovunque, ingombrando l'interfaccia

Soluzione 1: Abilita il ridisegno AJAX per il filtro dipendente

Soluzione 2: Crea shortcode [woof_dynamic] con mapping delle categorie

Soluzione 3: Aggiungi gestione pagina Shop con filtri minimi

Soluzione 4: Usa Widget Logic per controllo visibilità avanzato

Approccio migliore: Combina le Soluzioni 2 + 3 per un filtro dinamico completo

Codice chiave:

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

Questo crea un'esperienza di filtraggio professionale e intuitiva, su misura per ogni categoria di prodotto.