Vai al contenuto

Come creare una mappa interattiva per il tuo sito

Disegna il cammino, l'ingresso o l'area di servizio da mostrare ai visitatori. Copia un iframe per aggiungere la mappa interattiva al sito.

Del team di Draw on a Map · Aggiornato il

Una mappa incorporata standard mostra un segnaposto. Questo non basta per trovare un ingresso laterale, seguire il cammino dalla stazione o vedere dove effettui consegne. Con Draw on a Map puoi prima disegnare questi dettagli e poi incorporare la mappa finita. Non servono chiavi API né account.

Crea la mappa e copia il codice di incorporamento

Salva la mappa nell’account prima di copiare il codice se il sito deve mostrare le modifiche successive. Il codice di una mappa non salvata crea una copia fissa.

  1. Apri Draw on a Map e cerca il luogo che ti interessa.
  2. Disegna percorso, area, frecce o note.
  3. Sposta e ingrandisci la mappa fino alla vista da mostrare inizialmente ai visitatori. La mappa incorporata si apre su quella vista.
  4. Seleziona Incorpora (</>) nella barra in alto.
  5. Scegli dove incollerai il codice: HTML, WordPress, Wix o Squarespace. La finestra mostra i passaggi per la piattaforma scelta.
  6. Imposta l’altezza e seleziona Copia codice.
  7. Incolla il codice nella pagina, pubblicala e controllala su computer e telefono.

La finestra Incorpora questa mappa con opzioni del sito, altezza e Copia codice

In WordPress, incolla il codice in un blocco HTML personalizzato. In Wix, aggiungi Incorpora codice → Incorpora HTML. In Squarespace, aggiungi un blocco Codice impostato su HTML.

Come si presenta il codice

<iframe
  src="https://drawonamap.com/embed/#..."
  title="Mappa incorporata di Draw on a Map"
  width="100%"
  height="420"
  style="border:0;"
  loading="lazy"
  referrerpolicy="no-referrer-when-downgrade"
  allow="geolocation"
  allowfullscreen></iframe>

Questo è un modello. Copia il codice reale dalla finestra Incorpora, che inserisce il valore src della tua mappa. La larghezza si adatta alla colonna che la contiene. Modifica height se la pagina richiede una mappa più alta o più bassa.

Le mappe incorporate gratuite mostrano «Powered by Draw on a Map». Per rimuoverlo, salva la mappa e passa a Pro.

Mantieni aggiornata la mappa incorporata

Salva la mappa nell’account prima di copiare il codice. La mappa incorporata mostrerà l’ultima versione salvata, così potrai correggere un percorso o spostare un segnaposto senza modificare il sito.

Il codice copiato da una mappa non salvata contiene il disegno nell’URL e non cambia quando modifichi la mappa. Dopo una modifica, riapri Incorpora, copia il nuovo codice e sostituisci il vecchio iframe.

I set di dati importati di grandi dimensioni non entrano in un URL. Se Incorpora ti chiede di salvare prima, salva la mappa e riapri Incorpora.

Se la mappa non compare

Usa un blocco che accetti HTML o codice iframe. Un campo che accetta solo un indirizzo web non funziona con l’iframe completo. Se la mappa scompare dopo la pubblicazione, la piattaforma potrebbe rimuovere gli iframe. Controlla le impostazioni dei contenuti incorporati.

Idee per le mappe sul sito

  • Eventi e matrimoni: segna l’ingresso giusto, la fermata della navetta e il parcheggio su una mappa.
  • Affitti e viaggi: disegna il cammino dalla stazione all’appartamento o la scorciatoia per la spiaggia.
  • Attività di servizi: disegna l’area che copri. Se i visitatori devono verificare il proprio indirizzo, il Widget area di servizio a pagamento trasforma il confine in un verificatore per il sito.

Crea la mappa per il tuo sito

Guide correlate