Come aggiungere google route al tuo sito

In qualità di esperto IT, ti mostrerò come aggiungere Google Routes al tuo sito web. Ciò consentirà ai tuoi visitatori di ottenere indicazioni stradali per la tua posizione ovunque si trovino. Innanzitutto, dovrai creare una chiave API di Google Maps. Puoi farlo accedendo alla Google Developers Console e creando un nuovo progetto. Dopo aver creato un progetto, fai clic sul link 'Abilita e gestisci API', quindi trova 'Maps Embed API' e abilitalo. Successivamente, dovrai ottenere il codice per il widget di Google Routes. Puoi trovare questo codice accedendo alla pagina dell'API di incorporamento di Google Maps e selezionando il pulsante 'Ottieni codice'. Copia il codice e incollalo nell'HTML del tuo sito web. Infine, dovrai aggiungere il seguente codice al tuo sito web per visualizzare il widget: Sostituisci 'YOUR_API_KEY' con la chiave API che hai creato in precedenza e 'Your+Destination' con l'indirizzo della tua posizione. Salva le modifiche e il gioco è fatto! I tuoi visitatori saranno ora in grado di ottenere indicazioni stradali per la tua posizione da qualsiasi parte del mondo.

Se lo vuoi sapere come aggiungere le indicazioni stradali di google al tuo sito web allora leggi questo post Google Maps è il più popolare servizio di mappe digitali In tutto il mondo. Utilizza le informazioni sul traffico in tempo reale per trovare il percorso migliore verso una determinata destinazione. Incorporamento di una mappa di Google al tuo blog o sito Web aiuta i tuoi visitatori a vedere la tua posizione su una mappa del mondo, vedere il tuo indirizzo e leggere le recensioni (se presenti). Sebbene tu possa facilmente incorporare una mappa sul tuo sito web utilizzando l'esclusivo generatore di codice di incorporamento di Google Maps, non puoi utilizzare questa mappa come strumento di navigazione per aiutare i tuoi visitatori a trovare la tua posizione. In questo post, ti mostreremo come utilizzare Google Maps per mostrare indicazioni stradali ai tuoi visitatori.

Esamineremo i seguenti 2 metodi attraverso i quali è possibile aggiungi le indicazioni stradali di Google al tuo sito web :

Inserisci la mappa google statica e utilizza il modulo html per mostrare il percorso della mappa
Utilizza il generatore di mappe iFrame

Diamo un'occhiata a questi metodi in dettaglio.

1] Inserisci una mappa statica di Google e utilizza un modulo HTML per mostrare il percorso della mappa.

Questo metodo include 2 passaggi. Passaggio 1: incorporamento statico Mappa di Google che individua la tua posizione esatta. Il passaggio 2 consiste nell'aggiungere un modulo HTML che accetta la posizione dell'utente e genera una mappa del percorso su Google Maps. Vediamo come questo può essere fatto.

A] Incorpora la mappa di Google nel tuo sito web

Avvia il browser.
aprire Google Maps in una nuova scheda del browser.
Inserisci il tuo indirizzo nella barra di ricerca di Google Maps nell'angolo in alto a sinistra.
Seleziona una posizione dall'elenco dei risultati visualizzati.
Nota: Se non riesci a trovare il tuo indirizzo, ingrandisci su Google Maps per seguirlo. Puoi utilizzare i panorami di Google Maps Street View per contrassegnare la tua posizione su una mappa. Una volta trovata, puoi inserire i dettagli del tuo indirizzo corretto utilizzando le opzioni 'Aggiungi una sede mancante' o 'Aggiungi la tua attività commerciale' e quindi inviare la tua posizione a Google per la verifica. Verrà aggiunto entro poche ore dall'invio della richiesta.
Quando viene visualizzato Google Maps per individuare la tua posizione esatta, fai clic sull'icona Condividere icona.
Passa a Incorpora una mappa scheda
Premere Copia HTML link per copiare il codice della mappa negli appunti. Puoi decidere quanto grande o piccola vuoi che la mappa appaia sul tuo sito web scegliendo una dimensione predefinita (piccola, media, grande) o inserendo una dimensione personalizzata.
Quindi vai al pannello di amministrazione del tuo sito.
Apri la pagina Web in cui desideri incorporare la mappa.
Passa alla visualizzazione dell'editor di codice.
Incolla il codice.
Uscire dall'editor di codice. Potrai vedere un'anteprima di Google Maps.

B] Utilizzare un modulo HTML per creare un percorso di navigazione su Google Maps.

Ritorna alla visualizzazione dell'editor di codice.
Aggiungi il codice mostrato nell'immagine seguente sotto il codice di Google Map:
Sostituisci il valore dell'indirizzo di destinazione evidenziato nell'immagine con l'indirizzo della tua posizione.
Uscire dalla visualizzazione dell'editor di codice.
Visualizza l'anteprima del codice e controlla se funziona aggiungendo un indirizzo nel campo 'Inserisci un indirizzo' e facendo clic sul pulsante Mostrami la direzione da seguire pulsante.
I passaggi precedenti dovrebbero visualizzare il percorso dall'indirizzo inserito alla tua posizione su Google Maps.
Se tutto va bene, allora puoi Pubblicare il codice.

2] Utilizzare il generatore di mappe iFrame

Avvia il browser.
aprire Generatore di mappe HTML gratuito in una nuova scheda del browser.
Inserisci il tuo indirizzo in Inserisci il tuo indirizzo campo di ricerca nel pannello di sinistra.
La tua posizione verrà visualizzata su Google Maps sul lato destro dello schermo. È possibile impostare il tipo di mappa, la distanza dello zoom, la larghezza o l'altezza. Puoi anche rendere reattiva la mappa facendo clic sul pulsante di attivazione accanto a Rendi la mappa reattiva opzione.
Clicca su Genera codice HTML bottone sotto.
Il codice apparirà. Continua Copia il codice negli appunti pulsante.
Accedi al pannello di amministrazione del tuo sito.
Apri la pagina in cui desideri posizionare la mappa.
Passa alla visualizzazione dell'editor di codice.
Incolla il codice.
Uscire dall'editor di codice.
Clicca su Anteprima pulsante. Apparirà l'anteprima della mappa.
Clicca su Indicazioni icona.
Google Maps si aprirà con il tuo indirizzo precompilato come destinazione.
Inserisci l'indirizzo di partenza. Puoi anche usare La tua posizione opzione per consentire a Google Maps di utilizzare la tua posizione corrente.
Apparirà la mappa del percorso.
Se tutto funziona bene, Pubblicare pagina.

In questo modo, i tuoi visitatori possono visualizzare la tua posizione su Google Maps incorporata nel tuo sito web e trovare indicazioni stradali dalla loro posizione alla tua. Spero che troverai utile questo post. Fateci sapere nei commenti se avete domande.

Leggi anche: Le migliori alternative a Google Maps per l'uso quotidiano.

Posso aggiungere Google Maps al mio sito web?

Sì, puoi aggiungere Google Maps al tuo sito web o blog. utilizzando Google Embed Code Generator o Google HTML Map Generator gratuito. . Entrambe queste opzioni ti consentono di incorporare una mappa di Google che individua il tuo indirizzo con una pallina rossa, anche se c'è una leggera differenza tra i due. Mentre il primo ti consente di incorporare una mappa statica che consente ai tuoi visitatori di vedere la tua posizione esatta, i punti di interesse nelle vicinanze, ecc., il secondo offre Indicazioni una funzione che crea una mappa del percorso completa che possono utilizzare per trovare indicazioni stradali per la tua posizione. A seconda delle tue esigenze, puoi utilizzare una qualsiasi di queste opzioni per aggiungere Google Maps al tuo sito web o blog.

Come posso ottenere il codice di incorporamento di Google Maps?

Ottenere il codice di incorporamento di Google Maps è piuttosto semplice. Apri semplicemente Google Maps in una nuova scheda nella finestra del browser e inserisci il tuo indirizzo nella barra di ricerca disponibile. Quando Maps seleziona e visualizza il tuo indirizzo, fai clic sull'icona Condividere icona. Nella finestra Condividi, fare clic sul pulsante Incorpora una mappa scheda Quindi fare clic su Copia HTML il link è mostrato nell'angolo in alto a destra. È tutto! Puoi anche fare clic sul menu (icona dell'hamburger) di Google Maps e fare clic sull'icona Condividi o incorpora una mappa opzione. Un altro modo per ottenere questo codice è attraverso il generatore di mappe HTML gratuito (Maps iFrame Generator) come descritto nel metodo 2 nel post sopra.

Per saperne di più: I migliori suggerimenti e trucchi di Google Maps per renderti un professionista.