WooCommerce Docs
Il widget Filtro prodotti – Categorie che fa parte dell’estensione WooCommerce Product Search fornisce un filtro live per le categorie dei prodotti nel vostro negozio. Mentre i tuoi clienti scelgono la categoria desiderata, trova i prodotti corrispondenti e li mostra sulla pagina del negozio.
Questo filtro live mostra le categorie di prodotti che il cliente può cliccare. Aggiornerà la pagina del negozio per includere i prodotti all’interno della categoria scelta.
Stili Torna all’inizio
Il filtro categoria offre diversi stili che forniscono una vista alternativa e un’esperienza utente. Questi possono essere personalizzati e includono l’opzione di mostrare le miniature per ogni termine.
Lo stile Elenco mostra i termini in modo verticale dove i termini genitori possono essere espandibili per mostrare i termini figli quando il visitatore ci passa sopra. Le impostazioni possono essere usate per mettere a punto l’aspetto e il comportamento.
Simile nel comportamento allo stile List, lo stile Inline rende i termini più orizzontalmente.
Lo stile Dropdown è anche ricercabile e offre impostazioni per mostrare miniature sia nella lista che per i termini scelti. Può espandersi su interazione dell’utente o essere usato con un’altezza flessibile o fissa.
Lo stile Select, più tradizionale, è più semplice ma simile al Dropdown. La sua dimensione può anche essere specificata in modo da poter utilizzare una versione più compatta o espansa per mostrare un certo numero di termini.
Tutti questi stili hanno impostazioni specifiche che permettono di personalizzare il loro aspetto e creare un’esperienza utente adeguata. Inoltre, anche i filtri degli attributi offrono questi stili.
Impostazioni Torna all’inizio
Le impostazioni delineate qui determinano l’aspetto e il comportamento del widget filtro.
- Il campo Titolo ti permette di impostare il titolo del widget. Raccomandiamo di lasciarlo vuoto e di fare in modo che il widget visualizzi invece il suo titolo automaticamente, in quanto si nasconderà quando non ci sono categorie corrispondenti da visualizzare e si mostrerà quando ce ne sono automaticamente. Se usi questo titolo, questo non accadrà.
Heading Back to top
- Show heading – Questa opzione mostrerà l’intestazione di questo filtro.
- Heading – Puoi inserire qui un’intestazione personalizzata o lasciarla vuota per usare quella predefinita. L’intestazione non verrà visualizzata quando non ci sono termini da mostrare.
- Intestazione per nessun risultato – Puoi inserire il testo di un’intestazione alternativa da visualizzare quando non ci sono risultati.
Visualizza Torna all’inizio
A seconda dello stile scelto, alcune opzioni potrebbero essere disponibili o meno.
- Mostra solo sulle pagine del negozio – Usa questa opzione per visualizzare il widget solo sulle pagine del negozio pertinenti. Questo include la pagina del negozio, il tag del prodotto e le pagine della categoria del prodotto ecc.
- Stile – Offre opzioni su come visualizzare i termini: Elenco, Inline, Select o Dropdown.
- Show thumbnails / Parents – Abilita questa opzione per mostrare le miniature dei termini. Un’opzione separata è fornita per mostrare le miniature per i termini genitori.
- Mostra miniature per selezionati – Disponibile quando Dropdown è scelto come stile. Se abilitato, visualizza le miniature anche per i termini selezionati.
- Mostra nomi / Genitori – Abilita questa opzione per mostrare i nomi dei termini. Un’opzione separata è fornita per mostrarli per i termini genitori.
- Mostra il conteggio dei prodotti – Se abilitato, il numero di prodotti correlati per termine sarà mostrato.
- Nascondi termini senza prodotti – Questo nasconderà automaticamente i termini che non hanno prodotti correlati.
- Testo per nessuna selezione – Questa opzione è disponibile quando Dropdown è scelto come stile e determina il testo che viene mostrato nel campo Dropdown quando nessun elemento è selezionato.
- Numero di termini – Se viene dato un numero, questo limita il numero di termini mostrati.
- Dimensione – Disponibile quando Select è scelto come stile. Determina la dimensione di visualizzazione della casella di selezione.
- Altezza – Disponibile quando Dropdown è scelto come stile. Se lasciato vuoto, le scelte del menu a tendina sono mostrate sotto quando il campo è focalizzato. Se viene inserito un numero semplice, ad esempio 5, il Dropdown adotterà un’altezza fissa per mostrare il numero di voci indicato. Se viene usato un numero con un’unità CSS*, per esempio 120px, il Dropdown adotterà un’altezza fissa secondo l’unità indicata. *Unità CSS consentite: px, mm, cm, in, pt, pc, em , ex, ch, rem, vw e vh.
- Nascondere il componente – Nascondi il componente filtro quando non ha opzioni, “sì” (di default) o “no”.
- Nascondi il widget – Nascondi il widget quando il componente non ha opzioni, “sì” (di default) o “no”.
Ordina Torna all’inizio
- Ordina per … – Usa questa opzione per determinare l’ordine in cui i termini sono mostrati. Puoi scegliere di ordinarli secondo uno dei vari criteri, come per esempio il Nome del termine per l’ordine alfabetico o l’ordine dei termini per visualizzarli come stabilito nella lista delle categorie di prodotti.
Navigazione Torna all’inizio
Le opzioni di questa sezione determinano come la gerarchia delle categorie di prodotti viene presentata al visitatore e come interagisce.
Se usi i valori predefiniti, le categorie principali vengono visualizzate e i loro figli sono nascosti.
Se passi il mouse su una categoria con figli, questa si espande e rivela i suoi figli. Questo continua finché ci sono figli più in basso nella gerarchia.
Sui dispositivi abilitati al tocco, puoi toccare il simbolo di espansione di una categoria per mostrare i suoi figli.
Ecco un esempio che mostra solo le categorie radice con i loro espansori:
Ecco la stessa area, ma ora i figli di entrambe le categorie sono stati espansi:
Le opzioni che controllano l’esperienza di navigazione attraverso le categorie di prodotti sono:
- Espandi termini figli – Qui puoi determinare a quale livello le categorie nascondono i figli. Per impostazione predefinita, vengono mostrate solo le categorie radice e se hanno figli, viene mostrato un simbolo di espansione.
- Espandi automaticamente – Questo è abilitato per impostazione predefinita in modo che le categorie espandibili rivelino automaticamente i loro figli al passaggio del mouse. Se la disattivi, devi cliccare esplicitamente sull’espansore per vedere i figli, proprio come devi toccarlo sui dispositivi touch-enabled.
- Ritira automaticamente – Quando ti muovi al di fuori dell’area in cui le categorie sono mostrate, i figli saranno automaticamente nascosti. Questo è abilitato di default.
- Mostra espansori – Questo mostrerà espansori e ritrattori per le categorie con figli.
- Mostra la gerarchia degli antenati – Questo determina se la gerarchia degli antenati basata sul contesto corrente viene mostrata.
- Mostra la navigazione degli antenati – Se abilitato, vengono mostrati dei link aggiuntivi per gli antenati che permettono di navigare all’indietro nella gerarchia.
Terms Back to top
- Depth – Questa opzione permette di limitare la profondità all’interno della gerarchia dei termini.
- Filtro – Questa opzione deve essere attivata per il filtraggio dal vivo.
- Gerarchico – Se i termini devono essere visualizzati come una gerarchia.
- Multiplo – Se vuoi permettere ai visitatori di selezionare più di un termine, attiva questa opzione.
- Mostra – Questo determina se a) Tutti i termini sono mostrati, o b) con Set, solo quelli che sono all’interno della gerarchia del termine selezionato sono mostrati.
- Termini da includere – È possibile indicare i termini che dovrebbero essere inclusi qui. Se lasciato vuoto, vengono visualizzati tutti i termini. Indica i termini per ID, slug o nome e separati da virgola.
- Termini da escludere – Indica i termini che dovrebbero essere esclusi qui per ID, slug o nome e separati da virgola. Se sono indicati i termini da includere, essi sovrascrivono completamente questo campo – usa uno dei due ma non entrambi.
- Termine padre – Questo limiterà i termini visualizzati ai figli di quello indicato. Il token {current} può essere usato per limitarlo ai figli del termine corrente.
Avanzato Torna all’inizio
Le opzioni avanzate dovrebbero essere lasciate ai loro valori predefiniti a meno che non ci sia la necessità di affrontare un caso specifico con questo filtro.
- ID di intestazione – Questo imposta l’ID dell’elemento di intestazione.
- Classe di intestazione – Questo imposta la classe dell’elemento di intestazione.
- Elemento di intestazione – Qui puoi scegliere quale tag HTML viene usato come elemento di intestazione.
- ID contenitore – Questo imposta l’ID dell’elemento contenitore div principale del filtro.
- Classe contenitore – Questo aggiunge alla classe dell’elemento contenitore div principale del filtro.