Tutorial WordPress affidabili, quando ne hai più bisogno.
Guida per principianti a WordPress
WPB Cup
25 Milioni+
Siti web che utilizzano i nostri plugin
16+
Anni di esperienza con WordPress
3000+
Tutorial WordPress di esperti

Come creare una ricerca con completamento automatico in tempo reale in WordPress

Quando i visitatori non trovano quello che cercano, non restano a lungo: se ne vanno, spesso per sempre.

La ricerca predefinita di WordPress non la rende facile. È lenta, macchinosa e obsoleta: digita una parola chiave, premi Invio, attendi il ricaricamento completo della pagina... solo per ottenere risultati che potrebbero non essere nemmeno pertinenti.

Ora immagina il contrario... risultati di ricerca che appaiono istantaneamente, nel momento in cui un visitatore inizia a digitare. Questa è la magia della ricerca con completamento automatico live (nota anche come ricerca Ajax). Sembra moderna, senza sforzo e mantiene le persone coinvolte sul tuo sito.

In questa guida, imparerai esattamente come aggiungere la ricerca con completamento automatico live a WordPress, in modo da poter fornire risultati fulminei, migliorare l'esperienza utente e mantenere i visitatori più a lungo sul sito.

Come creare una ricerca con completamento automatico in tempo reale in WordPress

Perché aggiungere la ricerca con completamento automatico live in WordPress?

La ricerca con completamento automatico live aiuta i visitatori a trovare più velocemente ciò che cercano sul tuo sito web, senza ricaricare la pagina. Mentre gli utenti digitano nella barra di ricerca, i risultati appaiono istantaneamente in un menu a discesa, in modo che possano fare clic e andare direttamente al contenuto di cui hanno bisogno.

Questo tipo di esperienza veloce e utile mantiene le persone più a lungo sul tuo sito WordPress. Non devono indovinare la parola chiave giusta o aspettare una pagina di risultati lenta. E hanno meno probabilità di incontrare un vicolo cieco.

Sfortunatamente, la ricerca di WordPress è piuttosto limitata per impostazione predefinita. Non cerca sempre cose come i dettagli del prodotto o i tipi di post personalizzati, e fatica con le corrispondenze esatte.

A volte mostra persino una pagina "nessun risultato trovato", anche quando il contenuto è presente.

Nessun risultato trovato per un termine di ricerca in WordPress

È qui che la ricerca live può essere davvero utile. È particolarmente utile per blog, siti di notizie e negozi online, dove i visitatori vogliono trovare qualcosa di specifico, velocemente.

Se vuoi rendere più facile per le persone scoprire i tuoi migliori contenuti, aggiungere la ricerca live è un modo semplice ed efficace per farlo.

Come aggiungere la ricerca live con completamento automatico in WordPress

Il modo più semplice per aggiungere la ricerca live con completamento automatico (Ajax) al tuo sito è utilizzare un plugin. In questo tutorial, utilizzerò il plugin gratuito SearchWP Live Ajax Search, che è uno dei migliori plugin di ricerca per WordPress.

Funziona subito aggiornando automaticamente qualsiasi modulo di ricerca *esistente* sul tuo sito, come quello nell'intestazione o nella barra laterale del tuo tema. Ciò significa che puoi ottenere suggerimenti di ricerca live istantaneamente senza dover scrivere codice o modificare alcuna impostazione.

Il plugin SearchWP Live Ajax WordPress

💡 Nota: Se vuoi ottimizzare ulteriormente la tua ricerca, ti consiglio di passare a SearchWP Pro. Ti consente di scegliere esattamente quali contenuti includere nella ricerca, inclusi campi personalizzati, tassonomie, prodotti WooCommerce, contenuti PDF e altro.

Puoi saperne di più su questo plugin nella nostra recensione dettagliata di SearchWP.

Ora, ti guiderò attraverso la creazione di una ricerca di completamento automatico live in WordPress.

Ecco una rapida panoramica di tutto ciò che tratterò:

Iniziamo!

Innanzitutto, devi installare e attivare il plugin SearchWP Live Ajax Search.

Puoi trovare questo plugin direttamente nella tua bacheca di WordPress andando su Plugin » Aggiungi nuovo e cercando “SearchWP Live Ajax Search”.

Una volta trovato il plugin nei risultati di ricerca, fai clic sul pulsante ‘Installa ora’. Dopo che l’installazione è completata, fai clic su ‘Attiva’ per abilitare il plugin sul tuo sito.

Attivazione del plugin SearchWP Live Ajax Search

Per istruzioni dettagliate sull’installazione, consulta la nostra guida passo passo su come installare un plugin WordPress.

Il plugin è completamente gratuito e sviluppato dallo stesso team dietro il plugin premium SearchWP. Funziona in modo indipendente, quindi non è necessario acquistare nulla per iniziare con la funzionalità di ricerca live.

Dopo l’attivazione, una nuova voce di menu ‘SearchWP’ apparirà nella tua area di amministrazione di WordPress. La userai per configurare le tue impostazioni nel passaggio successivo.

Passaggio 2: Configura le impostazioni di ricerca di base

Ora che il plugin è installato, devi abilitare la funzionalità di ricerca live.

Vai su SearchWP » Impostazioni nella tua bacheca di WordPress.

Il menu Impostazioni in SearchWP

Nella pagina delle impostazioni, vedrai alcune opzioni diverse per configurare la tua ricerca.

Assicurati di essere nella scheda ‘Ricerca Live’ e cerca l’interruttore ‘Abilita Ricerca Live’ in alto nella pagina.

Fai semplicemente clic sull’interruttore per attivarlo, e poi assicurati di fare clic sul pulsante ‘Salva’ per memorizzare le tue impostazioni.

Abilitazione della ricerca in tempo reale di SearchWP

Una volta abilitata, la ricerca Ajax live inizierà automaticamente a funzionare con i tuoi moduli di ricerca esistenti sul tuo sito WordPress.

Il plugin utilizza impostazioni predefinite intelligenti che funzionano bene per diversi tipi di siti web fin da subito. Per impostazione predefinita, cercherà nei titoli dei tuoi post e nei contenuti per fornire risultati pertinenti.

Passaggio 3: Aggiungi la barra di ricerca live al tuo sito (facoltativo)

Il plugin SearchWP Live Ajax Search abilita automaticamente la ricerca live su qualsiasi modulo di ricerca esistente nel tuo tema WordPress.

Tuttavia, potresti anche voler aggiungere una barra di ricerca in una nuova posizione, come la barra laterale, il piè di pagina o una pagina di destinazione personalizzata. Questo passaggio ti mostrerà come farlo.

Aggiungi la ricerca di completamento automatico live alle aree pronte per i widget

Per aggiungere una casella di ricerca alle aree widget come la barra laterale o il piè di pagina, devi andare su Aspetto » Widget nella tua bacheca di WordPress.

Fai clic sul pulsante '+' nell'area widget, come la barra laterale o il piè di pagina. Quindi, cerca il widget di ricerca.

Aggiunta del widget di ricerca

Una volta aggiunto, puoi personalizzare il testo segnaposto.

Ad esempio, se gestisci un sito di notizie, potresti personalizzare il titolo del widget con qualcosa come “Cerca le ultime notizie” o “Trova articoli di notizie”.

Oppure puoi semplicemente lasciarlo come “Cerca”.

Personalizzazione del testo segnaposto della ricerca

Non dimenticare di fare clic sul pulsante ‘Aggiorna’ per salvare le modifiche. La casella di ricerca live apparirà ora nella tua area widget.

Ecco come appare sul mio sito demo:

Anteprima della barra di ricerca con completamento automatico in tempo reale
Aggiungi la ricerca di completamento automatico live utilizzando l'editor completo del sito (FSE)

Se stai utilizzando un tema basato su blocchi che supporta l'Editor completo del sito, puoi aggiungere caselle di ricerca in diverse parti del tuo sito web, come l'intestazione, la barra laterale e altro ancora.

Innanzitutto, vai su Aspetto » Editor dalla tua bacheca di WordPress.

Vai all'editor completo del sito

Questo avvierà l'Editor completo del sito.

Quindi, devi aprire la scheda 'Modelli'.

Passaggio alla scheda Modelli

Da qui, fai clic sul modello che desideri modificare, come l'intestazione o un modello di pagina.

Le opzioni esatte dipenderanno dal tema che stai utilizzando, ma ti consiglio di scegliere un modello di intestazione o il menu di navigazione in modo che la barra di ricerca appaia in tutto il tuo sito web.

Selezione di un modello per aggiungere la funzione di ricerca con completamento automatico in tempo reale

Una volta fatto clic sul modello, vedrai un editor visivo con blocchi.

Fai clic sul pulsante '+' per aggiungere un nuovo blocco, quindi cerca 'Ricerca' nell'inseritore di blocchi.

Aggiunta del blocco di ricerca in FSE

Puoi spostare il blocco di ricerca su e giù nella posizione desiderata all'interno del modello.

Da qui, puoi personalizzare l'aspetto del blocco di ricerca utilizzando il pannello delle impostazioni del blocco.

Ad esempio, puoi regolare il testo segnaposto.

Se gestisci un blog WordPress, potresti voler usare qualcosa come "Cerca nel blog" o "Trova articoli utili". Oppure puoi anche lasciarlo semplicemente come "Cerca".

Personalizzazione del blocco di ricerca

Puoi anche personalizzare lo stile della barra di ricerca e le opzioni di layout per adattarle al design del tuo sito.

Una volta che sei soddisfatto dell'aspetto, fai clic sul pulsante ‘Aggiorna’ per salvare le modifiche.

Anteprima della barra di ricerca con completamento automatico in tempo reale

Passaggio 4: Testa e risolvi i problemi della tua ricerca live

Ora è il momento di testare la tua nuova funzionalità di ricerca live per assicurarti che funzioni correttamente.

Ti consiglio di aprire il tuo sito web in una finestra di navigazione in incognito e digitare alcuni caratteri nella casella di ricerca.

Se tutto funziona, vedrai apparire istantaneamente i risultati in un menu a discesa. Ciò significa che Ajax funziona correttamente.

Anteprima della ricerca in tempo reale

È una buona idea testare la tua ricerca live su diversi dispositivi, inclusi telefono e tablet, per assicurarti che sia compatibile con i dispositivi mobili. Prova anche su più browser, come Chrome, Firefox e Safari, per assicurarti che i risultati live appaiano in modo coerente.

Se la ricerca live non viene visualizzata o non funziona come previsto, i colpevoli più comuni sono problemi di cache e conflitti tra plugin.

Il tuo browser o il plugin di cache potrebbero memorizzare una vecchia versione dei file del tuo sito (una versione 'in cache') per velocizzare i tempi di caricamento. A volte, questo può impedire l'esecuzione corretta del nuovo script di ricerca live.

Svuotare la cache di WordPress e la cache del browser assicura che il tuo sito carichi la versione più recente dei suoi file, il che spesso risolve il problema.

Un buon plugin per questo è WP Rocket. È facile da usare per i principianti e ti permette di cancellare la cache, ottimizzare gli script e controllare come vengono caricati i file per migliorare le prestazioni.

Cancella la cache di WP Rocket

Per maggiori dettagli, puoi consultare la nostra guida su come cancellare la cache di WordPress.

Se ciò non risolve il problema, prova a disattivare gli altri plugin uno per uno per verificare conflitti. Questo può aiutarti a identificare se un altro plugin sta interferendo con la tua ricerca live.

Per ulteriori suggerimenti sulla risoluzione dei problemi, consulta la nostra guida su come risolvere i problemi di ricerca di WordPress non funzionante.

Suggerimento bonus: Aggiorna per una ricerca ancora più intelligente (corrispondenza sfocata)

La tua nuova ricerca live offre un'esperienza utente molto migliore ai tuoi visitatori. Ma cosa succede se qualcuno commette un errore di battitura? Per impostazione predefinita, WordPress potrebbe non restituire risultati per "wordpres" invece di "wordpress".

È qui che entra in gioco la ricerca fuzzy, una potente funzionalità disponibile nel plugin premium SearchWP .

La ricerca fuzzy aiuta il tuo sito web a capire cosa stanno cercando i tuoi utenti, anche se commettono errori di ortografia o usano parole parziali.

Ad esempio, se qualcuno cerca "vntage furniture", un sito con ricerca fuzzy mostrerà comunque risultati pertinenti per "vintage furniture".

Un esempio di ricerca fuzzy su un sito WordPress

Questo impedisce agli utenti di raggiungere una pagina senza risultati e li aiuta a trovare contenuti, migliorando l'esperienza utente e mantenendoli sul tuo sito.

Per istruzioni passo passo, puoi consultare la nostra guida su come aggiungere la ricerca fuzzy in WordPress.

Domande frequenti sull'aggiunta della ricerca di completamento automatico live in WordPress

Ricevo molte domande dai nostri lettori sulla funzionalità di ricerca di WordPress, quindi ho raccolto le risposte alle più comuni.

Qual è il miglior plugin di ricerca per WordPress?

Per la funzionalità di ricerca live, consiglio SearchWP Live Ajax Search perché è gratuito e funziona benissimo fin da subito.

Se hai bisogno di funzionalità più avanzate come la ricerca per campi personalizzati o analisi dettagliate, allora il plugin premium SearchWP è eccellente.

Come posso aggiungere l'autocompletamento ai campi indirizzo in WordPress?

L'autocompletamento degli indirizzi è diverso dalla ricerca di contenuti. Utilizza servizi come Google Places API per suggerire indirizzi reali mentre gli utenti digitano.

Avrai bisogno di un plugin per moduli come WPForms o Gravity Forms che includa funzionalità di autocompletamento degli indirizzi. Questo si collega ai servizi di mappatura per fornire suggerimenti di indirizzi stradali, che è separato dalla ricerca del contenuto del tuo sito.

Posso creare un modulo che permetta agli utenti di cercare all'interno di una categoria specifica?

Se vuoi aggiungere un menu a tendina in modo che gli utenti possano cercare per categoria, allora avrai bisogno del plugin SearchWP Pro.

Il plugin gratuito SearchWP Live Ajax Search (quello che trattiamo in questa guida) mostrerà i nomi delle categorie nei risultati live, ma non ti permetterà di creare un modulo di ricerca completo con filtri per categoria.

Per ottenere questa funzionalità, dovrai effettuare l'aggiornamento al plugin SearchWP completo e seguire il nostro tutorial su come cercare per categoria in WordPress.

Come aggiungo una funzionalità di ricerca al mio sito WordPress?

La maggior parte dei temi WordPress include un widget di ricerca integrato che puoi aggiungere al tuo menu, barra laterale, intestazione o piè di pagina.

Per maggiori dettagli, consulta la nostra guida su come aggiungere una barra di ricerca al tuo menu di WordPress.

Altre guide per migliorare la ricerca di WordPress

Spero che questa guida ti abbia aiutato ad aggiungere la ricerca con completamento automatico in tempo reale al tuo sito WordPress.

Potresti anche voler consultare le nostre altre guide correlate per migliorare la ricerca del tuo sito:

Se ti è piaciuto questo articolo, iscriviti al nostro canale YouTube per tutorial video su WordPress. Puoi anche trovarci su Twitter e Facebook.

Dichiarazione: Il nostro contenuto è supportato dai lettori. Ciò significa che se fai clic su alcuni dei nostri link, potremmo guadagnare una commissione. Vedi come è finanziato WPBeginner, perché è importante e come puoi supportarci. Ecco il nostro processo editoriale.

Il Toolkit WordPress Definitivo

Ottieni l'accesso GRATUITO al nostro toolkit - una raccolta di prodotti e risorse relative a WordPress che ogni professionista dovrebbe avere!

Interazioni del lettore

Commenti

  1. Congratulazioni, hai l'opportunità di essere il primo commentatore di questo articolo.
    Hai una domanda o un suggerimento? Lascia un commento per iniziare la discussione.

Lascia un commento

Grazie per aver scelto di lasciare un commento. Tieni presente che tutti i commenti sono moderati secondo la nostra politica sui commenti, e il tuo indirizzo email NON verrà pubblicato. Si prega di NON utilizzare parole chiave nel campo del nome. Avviamo una conversazione personale e significativa.