Html: incorporare Google Maps


Per inserire una mappa personalizzata all'interno del nostro sito dobbiamo inserire il codice HTML del punto scelto su Google Maps.

I siti web che necessitano dell'integrazione di una mappa personalizzata sono oggigiorno tantissimi: basti pensare al sito di una qualsiasi azienda o attività locale per capire immediatamente qual'è la portata di questo tipo di servizio e quanto può essere importante essere in grado di integrare, correttamente, una mappa dinamica all'interno di un sito web.

Come già detto, per raggiungere il nostro scopo, usufruiremo del servizio Google Maps che, oltre ad essere il più conosciuto ed utilizzato sistema di questo tipo, offre un metodo facile ed immediato per effettuare l'operazione di incorporazione di una mappa all'interno di una qualsiasi pagina web.

Per prima cosa, quindi, rechiamoci sul sito Google Maps all'indirizzo maps.google.it ed effettuiamo la ricerca di nostro interesse. Ai fini del nostro esempio andremo a localizzare sulla mappa un ipotetico negozio situato in piazza Duomo n.1 a Milano:

Una volta identificato il lugo di nostro interesse non dovremo fare altro che cliccare sul pulsante "Condividi":

nella finestra a comparsa, selezionare la voce "Incorpora Mappa":

Il codice che ci viene fornito è quello di un comune <iframe" che possiamo personalizzare nelle dimensioni agendo sul pulsante di selezione situato sulla nostra sinistra: così facendo ci verranno mostrate diverse opzioni relativamente alla dimensione della mappa (piccola, media, grande oppure dimensione personalizzata).
Cliccando sull'opzione "Dimensione personalizzata" potremo impostare a piacimento le dimensioni (in pixel) della mappa che andremo ad integrare sul nostro sito web:

Una volta ottenuto il codice HTML della mappa non dovremo fare altro che copiarlo ed incollarlo nel punto della nostra pagina web in cui desideriamo appaia la cartina dinamica.

Solitamente la mappa viene integrata in pagine ad hoc del sito come, ad esempio, la pagina "Contatti" o la pagina "Dove siamo".