Come aggiungere WooCommerce Product Search: una guida per migliorare l'esperienza di acquisto

Stai cercando di migliorare la ricerca dei prodotti nel tuo negozio WooCommerce? Se vuoi rendere più facile per i tuoi clienti trovare ciò che stanno cercando e incrementare le tue vendite, sei nel posto giusto!

Sappiamo tutti quanto può essere frustrante quando non riesci a trovare quello che stai cercando, giusto? Sostituendo la funzione di ricerca predefinita in WooCommerce con una soluzione più intelligente, puoi rendere più facile per i tuoi clienti scoprire i prodotti e avere un'ottima esperienza di acquisto. In questo articolo, ti mostreremo come creare un'esperienza di ricerca più innovativa e veloce per il tuo negozio online.

Ti guideremo attraverso il processo passo dopo passo. Quindi, preparati a potenziare la tua ricerca di prodotti WooCommerce! Alla fine di questa guida, avrai tutto ciò di cui hai bisogno per portare la tua ricerca di prodotti WooCommerce al livello successivo. Quindi, come aggiungere la ricerca di prodotti WooCommerce? Scopriamolo!

Come aggiungere WooCommerce Product Search in una pagina?

La ricerca di prodotti WooCommerce predefinita presenta limitazioni che possono influire sull'efficacia della scoperta del prodotto. Può fornire risultati imprecisi, funzionare lentamente man mano che il catalogo cresce, mancare di opzioni di filtro, lottare con sinonimi o errori di ortografia e offrire opzioni di ordinamento limitate. Superare queste limitazioni è fondamentale per migliorare l'esperienza di ricerca, aumentare le vendite e migliorare la soddisfazione del cliente.

ProductX supera queste limitazioni e ti consente di rendere la ricerca dei prodotti WooCommerce perfetta per il tuo negozio. Con la potenza della ricerca WooCommerce AJAX e un set completo di opzioni di personalizzazione, ProductX è ciò di cui hai effettivamente bisogno. Quindi, installa ProductX per anticipare il gioco.

E, come abbiamo detto in precedenza, tuffiamoci nell'aggiunta della ricerca di prodotti in WooCommerce senza indugio. Esistono 2 modi per utilizzare la ricerca di prodotti WooCommerce. Puoi usarlo su qualsiasi pagina o aggiungere l'opzione di ricerca nell'intestazione dello Store. Copriremo entrambi i modi, quindi resta fino alla fine.

Passaggio 1: aggiunta del blocco di ricerca del prodotto sulla pagina

Dopo aver installato correttamente ProductX, i blocchi di ricerca del prodotto sono ora disponibili per l'uso insieme alla sua personalizzazione estesa. Quindi, senza ulteriori indugi, lascia che ti mostriamo come aggiungere WooCommerce Product Search al tuo negozio.

Per prima cosa, devi andare su una pagina. Puoi andare all'opzione della pagina WordPress e fare clic su Aggiungi nuovo per creare una nuova pagina. Quindi, cerca "Ricerca prodotto" per selezionare questo blocco. E questo aggiungerà il blocco Cerca alla pagina.

Passaggio 2: personalizzazione del blocco di ricerca prodotti WooCommerce

Dopo aver aggiunto un blocco di ricerca prodotti, puoi personalizzarlo in base alle tue esigenze. Questo blocco offre molte opzioni di personalizzazione per effettuare la ricerca perfetta del prodotto per il tuo negozio.

Vediamo le opzioni di personalizzazione che otterrai senza alcun ritardo.

Cerca nei layout dei campi

Fare clic sull'opzione di layout per selezionare diversi layout per i campi di ricerca. Puoi sperimentare diversi layout per trovare quello che meglio si adatta al design del tuo sito web e all'esperienza utente.

Ci sono 5 layout del campo di ricerca tra cui scegliere e puoi facilmente fare clic per selezionare il layout che preferisci.

Cerca i layout dell'elenco prodotti

È possibile utilizzare il layout dell'elenco dei prodotti di ricerca per creare una visualizzazione visivamente piacevole e organizzata dei risultati della ricerca. Otterrai 3 diversi layout dell'elenco dei prodotti di ricerca e regolerai anche la larghezza, il numero di colonne e il divario tra le colonne per ottimizzare la disposizione delle miniature dei prodotti, dei titoli, dei prezzi e delle valutazioni.

Stile del modulo di ricerca

Utilizza le impostazioni dello stile del modulo di ricerca per modificare i colori (colore e sfondo dell'input), la tipografia, i bordi e altri elementi visivi, come il raggio del modulo e il riempimento dell'input del modulo di ricerca.

Il pannello delle impostazioni è molto intuitivo e puoi selezionare le impostazioni che preferisci per personalizzare le impostazioni adiacenti.

Categoria Stile

Con questa impostazione, puoi personalizzare lo stile delle categorie di prodotti visualizzate nei risultati della ricerca. Regola i colori del testo, il carattere, la spaziatura e il layout per evidenziare le tue categorie e renderle visivamente accattivanti.

È possibile personalizzare l'opzione tipografica per il testo selezionato e il testo a discesa. Inoltre, puoi regolare la larghezza, la larghezza del separatore, l'altezza e i colori del separatore.

Icona di ricerca

L'icona di ricerca è l'icona più intuitiva che le persone utilizzano per determinare un campo di ricerca. Dalle impostazioni dell'icona di ricerca, puoi regolarne le dimensioni, i colori e i colori di sfondo per le modalità normale e al passaggio del mouse. Personalizza il raggio, la larghezza e i margini del pulsante per posizionare perfettamente l'icona di ricerca.

Più pulsante Risultato

Il pulsante "Altri risultati" consente agli utenti di caricare ulteriori risultati di ricerca senza uscire dalla pagina, fornendo un modo conveniente per esplorare più prodotti. Per progettare perfettamente la ricerca del tuo prodotto, puoi modificare la tipografia, il testo e il colore al passaggio del mouse dalle sue impostazioni.

Stile a discesa

In queste impostazioni, puoi personalizzare lo stile dei menu a discesa nel tuo blocco di ricerca. Regola colori, bordo e raggio. Inoltre, otterrai l'impostazione dell'ombra della casella, la spaziatura degli elementi (X e Y) e un'opzione per scegliere il colore del separatore e regolare la larghezza del separatore.

Immagine del prodotto

Controlla la visualizzazione delle immagini dei prodotti nei risultati di ricerca con questa impostazione. Regola facilmente la larghezza, l'altezza e il raggio dell'immagine con impostazioni intuitive.

Titolo del prodotto

Personalizza l'aspetto dei titoli dei prodotti nei risultati della ricerca. Modifica tutte le impostazioni relative alla tipografia, il colore al passaggio del mouse e cerca il colore evidenziato per renderlo stupendo.

Prezzo del prodotto

Personalizza il colore e le impostazioni tipografiche necessarie da qui per mostrare meglio il prezzo del tuo prodotto nella casella di ricerca del prodotto.

Valutazione del prodotto

Controlla il colore delle valutazioni dei prodotti nei risultati di ricerca. Abilita o disabilita le valutazioni con un clic o cambia facilmente i colori della tua valutazione.

Come aggiungere WooCommerce Product Search nell'intestazione

Puoi anche aggiungere la ricerca del prodotto WooCommerce nell'intestazione. Ti mostreremo una guida passo passo in modo che tu possa usarlo senza problemi.

Passaggio 1: crea un modello salvato

Innanzitutto, devi attivare il componente aggiuntivo modello salvato.

Ora vai su ProductX→Modello salvato. E fai clic su "Aggiungi nuovo modello".

Aggiungi il "Blocco ricerca prodotto" e personalizzalo secondo necessità. E quindi fare clic su pubblica.

Passaggio 2: copia lo shortcode

Ritorna alla pagina "Modello salvato" (ProductX → Modello salvato). E vedrai uno Shortcode.

Fare clic sullo shortcode per copiarlo.

Passaggio 3: vai a Personalizzatore di temi

“Nota: puoi personalizzare la maggior parte dei temi dal suo customizer. E l'aggiunta della ricerca del prodotto WooCommerce può essere eseguita dalla sezione dell'intestazione di un tema. Temi diversi potrebbero avere nomi di menu diversi. Oggi stiamo usando il tema Kadence, per esempio.”

Ora vai su Aspetto → Personalizza.

Seleziona "Intestazione" per inserire le sue impostazioni.

Aggiungi HTML nella tua sezione preferita.

Passaggio 4: incolla lo shortcode

Ora, fai clic su HTML e vai alla scheda Testo. Vedrai un campo di testo qui.

Incolla lo shortcode nel campo di testo e fai clic su Pubblica.

Ciò aggiungerà l'opzione di ricerca del prodotto WooCommerce alla sezione dell'intestazione.

Nota: temi diversi hanno sezioni di intestazione di larghezza diversa. Se la ricerca del tuo prodotto non si adatta, regola "Larghezza" dalle impostazioni generali del blocco "Ricerca prodotto".

Conclusione

In conclusione, la personalizzazione di WooCommerce Product Search Block con ProductX ti consente di controllare completamente la tua esperienza di ricerca.

Con l'aiuto di impostazioni di personalizzazione complete, puoi creare un'esperienza di ricerca su misura e visivamente accattivante per i tuoi clienti.

Migliorare la funzionalità di ricerca dei prodotti migliora l'esperienza dell'utente e aumenta le possibilità che i clienti trovino i prodotti che desiderano, portando in ultima analisi a un miglioramento delle vendite e alla soddisfazione del cliente.

Con ProductX, puoi ottimizzare il tuo negozio WooCommerce e fornire agli acquirenti un'esperienza di ricerca ideale ed efficiente.

Puoi dare un'occhiata ai tutorial video di WordPress sul nostro canale YouTube. Inoltre, trovaci su Facebook e Twitter per aggiornamenti regolari!