Gli acquirenti che desiderano filtrare i prodotti WooCommerce per colore si scontrano con lo stesso ostacolo nella maggior parte dei negozi. Atterrano sulla pagina del negozio, vedono una griglia mista di ogni colore disponibile e non hanno modo di restringerla senza cliccare su ogni singolo prodotto.
WooCommerce non include un filtro colore per la pagina del negozio "out of the box". Senza di esso, la griglia dei tuoi prodotti mostra tutto in una volta e un cliente che cerca un colore specifico deve scorrere ogni elenco per trovarlo.
Un filtro colore risolve questo problema permettendo agli acquirenti di cliccare su un colore e vedere istantaneamente solo i prodotti che corrispondono. Abbiamo visto questa singola aggiunta mantenere i clienti sulla pagina più a lungo e ridurre la frustrazione che li manda da un concorrente.
In questo articolo, ti mostreremo come aggiungere un filtro colore al tuo negozio WooCommerce senza scrivere alcun codice.
Perché aggiungere un filtro colore al tuo negozio WooCommerce?
Dalla nostra esperienza, i negozi che vendono prodotti in più colori perdono più vendite a causa di questo esatto problema. Un acquirente con un colore specifico in mente rinuncia quando la griglia lo costringe a cercarlo.
Pensalo come un negozio di abbigliamento dove ogni maglietta, indipendentemente dal colore, è appesa alla stessa rastrelliera senza modo di ordinarla. Nessuno vuole sfogliare cento opzioni miste per trovare l'unica maglietta rossa per cui è entrato.
Questo è più importante per i negozi che vendono abbigliamento, arredamento per la casa, accessori o qualsiasi prodotto in cui il colore è un fattore decisivo. Quando i clienti non riescono a trovare rapidamente il loro colore, se ne vanno e quella vendita va altrove.
Aggiungere un filtro colore mette i prodotti giusti di fronte ai clienti giusti in pochi secondi. Tenendo conto di ciò, vediamo come aggiungerne uno al tuo negozio.
Aggiungere un filtro colore a WooCommerce
Il modo più semplice per aggiungere un filtro colore a WooCommerce è utilizzare un plugin come WPFilters.
WPFilters è il miglior plugin di filtraggio per WordPress, costruito dallo stesso team dietro SearchWP. Ti consente di aggiungere filtri in stile Amazon a qualsiasi negozio WooCommerce senza scrivere una singola riga di codice.
WPFilters estrae i valori dei tuoi colori direttamente dagli attributi dei prodotti WooCommerce e li trasforma in opzioni di filtro cliccabili sulla pagina del negozio. Puoi anche combinare il filtro colore con altri tipi di filtro come un cursore di intervallo di prezzo, caselle di controllo per categoria o una casella di ricerca per parole chiave per un'esperienza di acquisto ancora più precisa.
Ecco alcune cose che puoi fare con WPFilters:
- Filtra per qualsiasi attributo del prodotto: Estrai i valori dei colori direttamente dal tuo attributo Colore di WooCommerce e visualizzali come caselle di controllo che i clienti possono selezionare.
- Formati di visualizzazione multipli: Mostra le opzioni di colore come caselle di controllo, un menu a discesa o un elenco di radio per adattarsi al design del tuo negozio.
- Combina con altri filtri: Impila il filtro colore accanto a un filtro taglia, marca o prezzo in modo che i clienti possano restringere i risultati da più angolazioni contemporaneamente.
- Aggiornamento AJAX istantaneo: La griglia dei prodotti si aggiorna nel momento in cui un cliente seleziona un colore, senza bisogno di ricaricare la pagina.
Ora, vediamo come impostare un filtro colore sul tuo negozio WooCommerce.
Passaggio 1: Installa e Attiva WPFilters
Per prima cosa, dovrai visitare il sito web di SearchWP e iscriverti a un account WPFilters.
Una volta creato l'account, accedi alla tua area account e vai alla scheda Download.
Quindi, fai clic sul pulsante Scarica WPFilters per salvare il file ZIP del plugin sul tuo computer. Ti consigliamo inoltre di copiare la chiave di licenza da questa pagina, poiché ti servirà durante l'installazione.
Successivamente, carica e installa il plugin sul tuo sito WordPress. Se non l'hai mai fatto prima, consulta questa guida su come installare un plugin di WordPress.
Dopo aver attivato il plugin, apparirà la procedura guidata di configurazione. Fai semplicemente clic sul pulsante Iniziamo e segui le istruzioni sullo schermo per completare l'installazione.
WPFilters è pronto! Ora prepariamo i dati dei tuoi prodotti WooCommerce.
Passaggio 2: Imposta un attributo colore in WooCommerce
Prima di poter creare il filtro, devi configurare un attributo prodotto Colore in WooCommerce. WPFilters recupera i suoi valori direttamente dagli attributi dei tuoi prodotti, quindi questo è un passaggio obbligatorio se non l'hai già fatto.
Nota: Se hai già un attributo Colore con termini assegnati ai tuoi prodotti, puoi saltare al Passaggio 3.
Per iniziare, vai prima su Prodotti » Attributi dalla tua bacheca WordPress e quindi aggiungi i tuoi attributi.
Per istruzioni dettagliate, puoi consultare questa guida su come impostare correttamente tag, attributi e categorie di prodotti in WooCommerce.
Passaggio 3: Crea un elemento filtro colore in WPFilters
Ora naviga su WPFilters » Elementi dalla tua bacheca WordPress e fai clic sul pulsante Aggiungi nuovo.
Successivamente, puoi dare un nome al tuo filtro nella parte superiore dell'editor, ad esempio Filtra per colore.
Dopodiché, dovrai recarti nella sezione Campi filtro e selezionare l'opzione Casella di controllo. Questo crea un elenco di caselle di controllo per ogni colore che i clienti possono selezionare per restringere la griglia dei prodotti.
Da qui, puoi scorrere verso il basso fino alla sezione Origine dati e fare clic sul menu a discesa.
Nella sezione WooCommerce, seleziona l'attributo Colore prodotto (pa_color) che hai creato nel passaggio precedente. WPFilters recupererà automaticamente tutti i tuoi termini colore e li aggiungerà al filtro.
Passaggio 4: Personalizza le impostazioni del filtro colore
Con l'origine dati collegata, puoi perfezionare l'aspetto e il comportamento del filtro per i tuoi acquirenti.
Scorri fino alla sezione Contenitore e abilita l'interruttore Mostra titolo per visualizzare un'etichetta sopra le caselle di controllo, e attiva Espandibile se desideri che i visitatori possano nascondere il widget del filtro per risparmiare spazio sui dispositivi mobili.
Successivamente, scorri fino alla sezione Elementi.
Qui, l'abilitazione dell'opzione Conteggio elementi mostra ai clienti quanti prodotti sono disponibili per ogni colore, in modo che possano prendere decisioni più rapide.
Al termine, scorri verso l'alto e fai clic sul pulsante Salva.
Vedrai un'anteprima live del filtro nel pannello a sinistra.
Passaggio 5: Aggiungi il filtro colore al tuo negozio WooCommerce
Con il filtro salvato, il passo finale è inserirlo nel tuo negozio. Consigliamo di aggiungerlo all'area widget della barra laterale widget area nella tua pagina negozio, dove rimane visibile mentre i clienti scorrono e si adatta al layout standard di WooCommerce.
Per iniziare, vai su Aspetto » Widget dalla tua bacheca WordPress. Nota che questo passaggio potrebbe apparire diverso a seconda del tema che stai utilizzando.
Da qui, dovrai trovare l'area della barra laterale utilizzata dalla tua pagina negozio (solitamente Barra laterale WooCommerce) e fare clic sul pulsante + per aggiungere un nuovo blocco. Quindi cerca WPFilters Element e aggiungi il widget.
Una volta aggiunto il blocco widget WPFilters Element, puoi selezionare i tuoi filtri colore.
Nel pannello Impostazioni elemento a destra, apri il menu a discesa Seleziona elemento e scegli il filtro 'Filtra per colore'.
Al termine, fai clic su Aggiorna.
Ora visita la tua pagina negozio e prova il filtro. Seleziona il colore Carbone e conferma che solo i prodotti con il colore assegnato appaiano nella griglia.
FAQ sull'aggiunta di filtri colore
1. WPFilters recupera automaticamente i miei valori colore da WooCommerce?
Sì. Una volta collegato il filtro al tuo attributo prodotto Colore di WooCommerce, WPFilters recupera automaticamente tutti i tuoi termini colore e visualizza ciascuno come opzione checkbox. Non è necessario inserire i colori manualmente all'interno del plugin.
2. Posso combinare il filtro colore con un filtro prezzo o categoria?
Sì. Puoi creare elementi filtro separati per prezzo, categoria, taglia o qualsiasi altro attributo in WPFilters e aggiungerli tutti alla stessa barra laterale. I clienti possono quindi restringere i risultati da più angolazioni contemporaneamente, ad esempio filtrando sia per Rosso che per una fascia di prezzo inferiore a $50.
3. Il filtro colore funzionerà con i prodotti WooCommerce variabili?
Sì. WPFilters funziona con tutti i tipi di prodotto standard di WooCommerce, inclusi i prodotti variabili. Quando un cliente filtra per colore, WPFilters visualizza qualsiasi prodotto che ha una variazione corrispondente a quel colore, anche se sono disponibili altre variazioni in colori diversi.
4. I clienti possono selezionare più di un colore alla volta?
Sì. Il tipo di campo Casella di controllo consente ai clienti di selezionare più colori contemporaneamente. Se un cliente seleziona sia Blu che Nero, WPFilters mostra tutti i prodotti disponibili in entrambi i colori. Passa al tipo di campo Radio se desideri limitare i clienti a una sola selezione alla volta.
Speriamo che questo articolo ti abbia aiutato a imparare come filtrare i prodotti WooCommerce per colore. Potresti anche voler consultare le nostre guide su come filtrare i prodotti WooCommerce per attributi e come filtrare i prodotti WooCommerce per tag.
Pronto a offrire ai tuoi clienti un modo più veloce per trovare i prodotti per colore? Puoi iniziare con WPFilters qui.
