Come aggiungere il completamento automatico per i campi indirizzo in WordPress

L’aggiunta del completamento automatico per i campi degli indirizzi può rendere i moduli di WordPress più user-friendly. Gli utenti possono scegliere rapidamente gli indirizzi dai suggerimenti mentre digitano, velocizzando il processo e riducendo gli errori.

Recentemente, uno dei nostri utenti ha chiesto di sapere come impostare questa funzione per i propri moduli. Con il completamento automatico, gli utenti possono godere di un’esperienza più fluida e ottenere indirizzamenti accurati.

In questo articolo vi illustreremo i passaggi per aggiungere il completamento automatico degli indirizzi al vostro sito WordPress utilizzando l’API di Google Places. È un modo semplice per migliorare i vostri moduli e renderli più efficienti.

Perché aggiungere campi di indirizzamento con completamento automatico in WordPress?

L’aggiunta di campi di indirizzamento con completamento automatico in WordPress può aiutarvi a migliorare l’esperienza utente del vostro sito web.

Ad esempio, se possedete un negozio di e-commerce, i vostri clienti potranno inserire i loro indirizzi più velocemente ed evitare errori di battitura.

Quando gli acquirenti digitano il loro indirizzo, sullo schermo vengono visualizzati i possibili indirizzi in base alla loro posizione attuale, quindi tutto ciò che devono fare è scegliere quello corretto. Ciò consente di ridurre gli errori, poiché le opzioni mostrate all’utente sono collegate alle API di Google Places e Google Maps.

Il completamento automatico dei campi degli indirizzi è una delle funzionalità più comode che potete offrire ai vostri utenti. Se potete aiutare rapidamente gli acquirenti nel pagamento, è più probabile che completino l’acquisto.

Questo può portare a un miglioramento delle vendite e a trasformare l’acquirente occasionale in un cliente ricorrente.

Ora che avete capito i vantaggi dell’aggiunta di campi di indirizzamento con completamento automatico in WordPress, vi mostreremo come farlo passo dopo passo.

Ecco una rapida panoramica di tutti i passaggi di cui ci occuperemo in questo articolo:

Pronti? Iniziamo con un video tutorial.

Video tutorial

Subscribe to WPBeginner

Se preferite le istruzioni scritte, continuate a leggere.

Passo 1: Installazione e attivazione del completamento automatico dell’indirizzo di Google

La prima cosa da fare è installare e attivare il plugin Autocomplete Google Address .

Per maggiori dettagli, potete fare riferimento alla nostra guida passo-passo su come installare un plugin di WordPress.

Dopo l’attivazione, andiamo su Impostazioni ” Completamento automatico dalla vostra dashboard di WordPress per configurare le impostazioni del plugin.

Verrà quindi richiesto di inserire la chiave API di Google Places. Questa chiave API permette al sito web di connettersi con Google Maps e di recuperare i suggerimenti di completamento automatico dal suo database in tempo reale.

Passo 2: Accesso alla chiave API di Google Places

Per accedere alla chiave API di Google Places, si può andare sul sito web di Google Developer Console e creare un nuovo progetto.

Verrà visualizzata una nuova pagina in cui si chiede di dare un nome al progetto. Si consiglia di utilizzare un nome che consenta di identificare facilmente il progetto.

Quindi, si può fare clic sul pulsante “Crea”.

Se si desidera connettersi a un’organizzazione, è possibile colpire il link “Sfoglia” per visualizzare un menu a discesa di opzioni.

Attendete qualche secondo e sarete automaticamente reindirizzati alla pagina “API e servizi”.

Da qui, si deve navigare nel pannello laterale sinistro e fare clic sulla scheda “Libreria”.

A questo punto, verrà visualizzato l’elenco delle API di Google abilitate per il progetto. Nel pannello di sinistra, selezionare “Mappe” per filtrare le opzioni relative alle mappe.

Da qui, dovrete trovare e fare clic sull’opzione “Places API”.

Verrete quindi indirizzati alla pagina di riepilogo “Places API”.

È sufficiente fare clic sul pulsante “Abilita” per autorizzare l’API.

Se Google Console è impostata correttamente, dovrebbe apparire una finestra pop-up con la chiave API.

Tuttavia, se è la prima volta che si configura l’account di Google Console, potrebbe essere necessario inserire i dati di fatturazione.

Ora potete tornare al vostro sito WordPress.

Quindi, incollare la chiave API dalla Google Console dove è scritto “Chiave API di Google Place”.

Per assicurarsi che il completamento automatico dell’indirizzo funzioni in WordPress, è necessario abilitare l’API JavaScript di Google Maps.

Quindi, tutto ciò che dovete fare è tornare alla scheda “API e servizi” dalla Bacheca di Google Developer Console. Quindi, cercate “Maps JavaScript API” e fate clic su “Abilita”.

Ora siamo pronti ad aggiungere l’ID del modulo.

Per il passo successivo, è necessario l’ID del modulo del campo dell’indirizzo in cui si vuole aggiungere la caratteristica del completamento automatico dell’indirizzo.

Passo 3: Abilitazione del completamento automatico dell’indirizzo nei campi modulo di WordPress

È possibile aggiungere una funzione di completamento automatico dell’indirizzo a qualsiasi campo del modulo creato da qualsiasi plugin per la creazione di moduli di WordPress.

In questo tutorial utilizzeremo WPForms, poiché è il miglior builder di moduli a trascinamento e il più facile per i principianti. Tuttavia, queste istruzioni funzionano indipendentemente dal plugin per moduli di contatto utilizzato.

Per prima cosa, dovrete creare un modulo con un campo indirizzo o una serie di campi indirizzo. Una volta terminato, potete aggiungere questo modulo al vostro sito web WordPress come fareste normalmente. Se avete bisogno di aiuto, potete leggere la nostra guida su come creare un modulo di contatto.

Apriamo quindi l’articolo o la pagina in cui è stato aggiunto il modulo, facciamo clic con il tasto destro del mouse sul campo dell’indirizzo e selezioniamo “Ispeziona” dal menu del browser.

Qui si vedrà una sezione in evidenza con il valore dell’ID del modulo per il campo di input.

Ad esempio, in questa schermata, il valore dell’ID del nostro modulo è wpforms-567-field_4.

È necessario copiare questo valore e incollarlo nella pagina delle impostazioni del plugin.

Tuttavia, è necessario aggiungere la caratteristica del completamento automatico all’intero modulo dell’indirizzo. Ad esempio, se si desidera che gli utenti siano in grado di compilare automaticamente l’intero indirizzo di spedizione, è necessario che inseriscano automaticamente la città, l’inizio e il codice postale.

In questo caso, è necessario seguire la stessa procedura facendo clic su ‘Ispeziona’ e trovando poi l’ID del modulo per ogni campo.

Una volta ottenuti tutti gli ID, copiateli nella pagina “Completamento automatico”, dove è scritto “ID modulo”.

Quando si aggiungono più ID, è necessario separare ogni ID con una virgola e le virgolette, come mostrato di seguito.

Una volta terminato, non dimenticate di hittare “Salva modifiche”.

È tutto; ora è possibile visitare la pagina del modulo e provare a inserire un indirizzo. Il campo del modulo mostrerà automaticamente i suggerimenti di Google Places e Google Maps.

Ora avete aggiunto con successo la caratteristica di completamento automatico degli indirizzi di Google ai vostri moduli. Gli utenti potranno compilare automaticamente il modulo, sia che stiano effettuando il check-out dal vostro negozio WooCommerce sia che stiano completando la registrazione di un utente.

Suggerimento bonus: Tracciare e ridurre l’abbandono dei moduli in WordPress

L’abbandono del modulo avviene quando le persone lasciano un modulo senza inviarlo, spesso a causa di una cattiva esperienza utente o per altri motivi.

Ridurre l’abbandono dei moduli è importante perché importa la crescita della vostra mailing list, le vendite del vostro e-commerce e il successo generale dell’azienda. Gli studi dimostrano che oltre il 77% degli acquirenti online non termina il modulo di pagamento, il che significa perdere molto denaro a causa di vendite incomplete.

Tracciando e migliorando i moduli che le persone abbandonano spesso, è possibile ridurre queste perdite di entrate. Anche se il completamento automatico può aiutare, ci sono altri fattori che possono contribuire all’abbandono dei moduli:

• Campi facoltativi resi obbligatori: Far compilare alle persone informazioni non essenziali può essere davvero fastidioso.
• Istruzioni poco chiare: Campi modulo confusi o vaghi possono far desistere le persone.
• Facilità di utilizzo da parte dei dispositivi mobili: I moduli difficili da usare sui dispositivi mobili possono essere un grosso off.
• Problemi tecnici: Problemi come l’elaborazione in corso del modulo o tempi di caricamento lenti possono impedire alle persone di completarlo.

Per saperne di più, potete leggere tutta la nostra guida su come monitorare e ridurre l’abbandono dei moduli in WordPress.

Speriamo che questo articolo vi abbia aiutato a capire come aggiungere il completamento automatico per i campi indirizzo in WordPress. Potreste anche voler consultare i nostri consigli degli esperti per creare moduli più interattivi e aumentare le conversioni o la nostra guida su come personalizzare e stilizzare i moduli di WordPress.

Se questo articolo vi è piaciuto, iscrivetevi al nostro canale YouTube per le esercitazioni video su WordPress. Potete trovarci anche su Twitter e Facebook.