Guida completa: come incorporare Google Maps in WordPress

Come incorporare una singola posizione di Google Maps in WordPress

Iniziamo con il modo più semplice per mostrare una posizione di Google Maps sul tuo sito WordPress. Se vuoi solo incorporare una mappa con una singola posizione o vista, non hai bisogno di strumenti o plug-in fantasiosi: tutto ciò che serve è incollare il codice di incorporamento di Google Maps nel tuo sito WordPress .

Ecco come funziona il tutto:

Vai al sito Web di Google Maps come di consueto e cerca la posizione che desideri incorporare. Puoi cercare qualsiasi cosa. Questo è:

• Un intero paese
• Una città specifica
• Un affare specifico
• Lo chiami

Non importa!

Una volta che hai la posizione che vuoi mostrare sulla mappa, cerca il pulsante Condividi nella barra laterale di sinistra:

Dovresti vedere apparire un piccolo popup. Fai clic sull'opzione Incorpora mappa in quel popup:

Quindi, scegli la taglia desiderata dal menu a discesa. E una volta selezionata la taglia che desideri, copia il codice nella casella:

Ora vai al post o alla pagina di WordPress in cui desideri incorporare la casella di Google Maps.

Nell'editor di WordPress, passa alla scheda Testo e incolla il codice che hai copiato da Google Maps nel punto in cui desideri che appaia la tua mappa:

Ora pubblica il tuo post normalmente e dovresti vedere la tua casella di Google Maps sul front-end del tuo sito WordPress:

Abbastanza facile, giusto?

Puoi anche utilizzare un metodo simile per incorporare le indicazioni di Google Maps in WordPress. L'unica differenza è l'interfaccia di partenza. Invece di vedere subito il pulsante Condividi , dovrai fare clic sull'icona dell'hamburger e scegliere l'opzione Condividi o incorpora mappa :

Come incorporare Google Maps con più indicatori di posizione in WordPress

Se vuoi incorporare una casella di Google Maps con più indicatori di posizione in WordPress, le cose sono leggermente diverse.

Mentre ti mostrerò due plug-in WordPress di Google Maps per aiutarti a raggiungere questo obiettivo nella prossima sezione, in realtà non hai bisogno di un plug-in per farlo .

Invece, puoi creare la tua mappa utilizzando Google My Maps e quindi incorporare quella mappa in WordPress utilizzando un metodo simile a quello descritto sopra.

Per iniziare, vai su Le mie mappe di Google e fai clic su Inizia per avviare l'interfaccia. Nell'interfaccia, fai clic sull'opzione per creare una nuova mappa :

Quindi, usa l'interfaccia per costruire la tua mappa. Può essere un po' complicato iniziare, ma una volta che hai imparato le cose, è abbastanza facile da usare. Puoi cercare oggetti utilizzando la casella di ricerca e puoi aggiungere indicatori sulla mappa utilizzando il pulsante Indicatore :

Quando sei soddisfatto della tua mappa, fai clic sull'icona dei tre punti in alto e seleziona Incorpora nel mio sito .

Quindi, proprio come prima, puoi incollare il codice che Google Maps ti fornisce nella scheda Testo dell'editor di WordPress per visualizzare la mappa sul tuo sito WordPress.

Plugin WordPress per aiutarti a lavorare ancora di più con Google Maps

Anche se non hai davvero bisogno di un plug-in per gestire l'incorporamento di base di Google Maps come ti ho mostrato sopra, i plug-in possono tornare utili se desideri maggiore flessibilità (o se desideri un modo più intuitivo per implementare tale flessibilità).

La maggior parte dei plugin non fa davvero nulla che non potresti fare da solo con abbastanza olio di gomito, ma lo rendono molto più semplice e facile da usare. Ecco alcuni plugin utili per aiutarti a lavorare meglio con Google Maps.

WP Google Maps

WP Google Maps è il plug-in gratuito di Google Maps più popolare nella directory dei plug-in di WordPress.org.

Ti aiuta a creare le tue visualizzazioni personalizzate di Google Maps utilizzando gli indicatori di mappa che scegli e diversi temi di mappa. Fondamentalmente, è un'implementazione più intuitiva del processo che ho appena descritto sopra.

L'unico aspetto negativo è che la versione gratuita ti consente solo di creare una singola mappa. Se hai bisogno di più mappe, dovrai acquistare la versione premium o utilizzare una soluzione diversa.

Per iniziare, installa e attiva WP Google Maps. Poiché è elencato su WordPress.org, puoi farlo direttamente dalla dashboard di WordPress.

Una volta attivato, vai alla nuova opzione Mappe nella barra laterale per iniziare.

Prima di poter creare la tua prima mappa, tuttavia, dovrai ottenere una chiave API JavaScript di Google Maps e inserirla nelle impostazioni del plug-in. Puoi farlo seguendo queste istruzioni:

Una volta inserita la chiave API, puoi modificare l'impostazione predefinita La mia prima mappa ( ricorda: la versione gratuita di questo plugin ti consente di creare solo una mappa ):

Usa l'interfaccia per costruire la tua mappa. Quindi, quando hai finito, puoi incorporarlo ovunque sul tuo sito utilizzando lo shortcode:

È super facile e flessibile: l'unico aspetto negativo è la limitazione di una mappa nella versione gratuita.

Costruttore di mappe

Un'altra buona opzione per creare incorporamenti di Google Maps con un plug-in di WordPress è Maps Builder.

Dopo aver installato e attivato il plug-in, otterrai una nuova scheda di Google Maps nella barra laterale della dashboard. Come con WP Google Maps, dovrai aggiungere una chiave API di Google Maps prima di poter iniziare con il plug-in.

Una volta fatto, puoi andare su Google Maps → Aggiungi nuovo per creare una nuova mappa. In tale interfaccia, fai clic sul pulsante Apri Map Builder per avviare l'interfaccia intuitiva:

Lì puoi costruire la tua mappa usando la barra laterale del plugin:

Una volta terminato, puoi utilizzare lo shortcode creato dal plug-in per incorporare la mappa in qualsiasi punto del tuo sito WordPress.

Localizzatore di negozi WP

Se desideri specificamente utilizzare Google Maps per visualizzare più posizioni di negozi sul tuo sito WordPress ( un desiderio comune! ), potresti fare meglio a utilizzare un plug-in dedicato per la localizzazione di negozi.

Anche se puoi trovare diversi plugin per farlo, mi piace WP Store Locator perché è flessibile e ha un bell'aspetto.

Usa il modulo Google Maps del tuo Page Builder preferito

La maggior parte dei costruttori di pagine di WordPress include un elemento/modulo Google Maps dedicato per aiutarti a incorporare i contenuti di Google Maps nei tuoi progetti.

Ad esempio, il popolare plug-in Divi Builder include un modulo Google Maps che puoi personalizzare abbastanza tramite l'interfaccia del plug-in:

Quindi, se stai già utilizzando un generatore di pagine, controlla se il tuo generatore di pagine ha uno strumento di Google Maps prima di andare a cercare un plug-in di Google Maps dedicato,

Una modifica divertente per utenti avanzati

Questo metodo è avanzato e richiede la conoscenza del codice, quindi se sei un principiante, sentiti libero di ignorarlo.

Ma se conosci WordPress e i campi personalizzati, puoi utilizzare un campo personalizzato per creare automaticamente una mappa basata sullo schema degli URL delle mappe di Google Maps.

Ad esempio, puoi creare un campo sul backend di WordPress in cui un utente deve solo incollare l'indirizzo in una posizione.

Quindi, con una piccola pre-elaborazione per rimuovere gli spazi, puoi inserire quell'indirizzo in qualcosa come di seguito in un iframe nei file modello del tuo tema:

E voilà! Tutto ciò che un utente deve fare è inserire un indirizzo nell'editor di WordPress e un incorporamento di Google Maps apparirà automaticamente sul front-end per quella posizione.

Ancora una volta, questo metodo richiede sicuramente una conoscenza di base di PHP e campi personalizzati, ma è un ottimo trucco per risparmiare tempo.

Avvolgere le cose

Sia che tu voglia semplicemente fare qualcosa di semplice come incorporare una normale posizione di Google Maps in WordPress o diventare più avanzato con più indicatori di mappa o la creazione automatica di mappe, hai molte opzioni.

Per incorporare singole mappe, probabilmente puoi saltare i plug-in e utilizzare semplicemente il normale codice di incorporamento di Google Maps. Ma se vuoi creare mappe con più posizioni e avere un facile controllo sullo stile, i due plug-in di Google Maps sono buone opzioni.

E infine, se stai utilizzando un generatore di pagine, dovresti assolutamente verificare se hai già un elemento di Google Maps prima di passare a una soluzione esterna.