Vai al contenuto principale
IT Deutsch Español Français Português

Widget: Mappa

Categorie di widget: Affari

Mostra ai tuoi visitatori una mappa di qualsiasi luogo che desideri. Usa il widget Mappa per mostrare l'ubicazione della tua attività fisica o di un evento speciale. Puoi anche usarlo per mostrare ai clienti dove troveranno

Per informazioni sull'aggiunta di widget, consulta Aggiungi widget.

Suggerimento

Per ulteriori informazioni sui widget e sulla libreria dei widget, vedere Widget: libreria e panoramica.

Google Maps come fornitore di mappe predefinito

Mapbox è il provider di mappe predefinito per il widget Mappa. Tuttavia, puoi impostare Google Maps come fornitore di mappe predefinito per tutti i siti nuovi ed esistenti nel tuo account. Oltre al widget Mappa, Google Maps diventerà l'impostazione predefinita in tutte le ricerche di località e nelle mappe per la Libreria dei contenuti e altri widget applicabili

Tutti i dati sulla posizione di Mapbox vengono salvati e applicati a Google Maps. Ciò garantisce che non sia necessario configurare nuovamente le sedi.

Tieni presente che questa funzione può essere abilitata solo dai membri dello staff con l'autorizzazione al branding dell'account.

Per impostare Google Maps come fornitore di mappe predefinito:

  1. Nel tuo account Google Maps, genera una chiave API. Per sapere come generare una chiave API, consultaLa documentazione di Google. Ti consigliamo di recensirePolitica di utilizzo e fatturazione di Google.

  2. (Opzionale) Se configuri il tuo account Google in modo che la chiave API possa essere utilizzata solo su siti Web specifici, devi aggiungere duda.co, il dominio del tuo sito e, se applicabile, eventuali domini white label all'elenco dei siti Web consentiti nel tuo account Google. È importante utilizzare il seguente formato per i tuoi domini:*.duda.co/*

  3. Dalla tua dashboard, fai clic sul tuo avatar nell'angolo in alto a destra e selezionaAccount.

  4. Nella pagina Impostazioni dell'account, scorri verso il basso fino aIntegrazione con Google Mapsezione e fai clicConfigura.

  5. Incolla la tua chiave API nel campo, quindi fai clic suApplica a tutti i siti. Ciò rende Google Maps la mappa predefinita per tutti i siti esistenti e nuovi del tuo account.

In qualsiasi momento, puoi disattivare Google Maps e tornare a Mapbox. Tutti i dati sulla posizione di Google Maps verranno salvati e applicati automaticamente a Mapbox al passaggio

Editor di contenuti

Per accedere all'editor dei contenuti, fai clic con il pulsante destro del mouse sul widget e seleziona Modifica contenuto. Oppure, se sei in modalità flex o Editor 2.0, l'opzione per accedere all'editor di contenuti è disponibile nel menu mobile. Fai clic sull'elemento per aprire il menu mobile, quindi fai clic sull'opzione per l'editor di contenuti.

Opzioni di configurazione della mappa

  • Digita l'indirizzo della tua attività nell'apposito campo.

    • Seleziona l'indirizzo dal menu a discesa che appare.

      Nota

      Se il tuo indirizzo non viene visualizzato nel menu a discesa, significa QUI il database utilizzato da Website Builder non contiene l'indirizzo. Per inviare o correggere l'indirizzo, contatta HERE Map Creator.

      Quando utilizzi Google Maps come provider predefinito, consulta la documentazione di Google, Aggiungi un luogo mancante a Google Maps.

  • Puoi scegliere di visualizzare un pulsante della mappa anziché un'immagine della mappa.

    • Per visualizzare un pulsante della mappa su dispositivi specifici nell'editor classico, seleziona Usa il pulsante su dispositivi (Selector for three screen types: desktop, tablet, or phone) dove desideri che appaia il pulsante. Se non viene scelto alcun dispositivo, verrà visualizzata l'immagine della mappa.

    • Editor 2.0: Per abilitare il pulsante per tutti i dispositivi, fai clic su Imposta come pulsante su tutti i dispositivi attiva/disattiva.

  • Digita il testo che vuoi che appaia sul pulsante nel Testo sul pulsante campo fornito.

  • Popup di informazioni sulla posizione (Finestra informativa per l'indicatore della mappa). Per visualizzare un popup con informazioni sulla posizione sul widget della mappa

    • Digita un titolo e una descrizione per il popup.

    • Seleziona per visualizzare il popupAl passaggio del mouse,Con un clic, oSempredal menu a discesa del display Popup.

Editor di progettazione

Per accedere all'editor di progettazione, fate clic con il pulsante destro del mouse sull'elemento e fate clicModifica design. Oppure, se sei in modalità flex o Editor 2.0, seleziona Modifica design dal menu mobile per aprire il pannello di progettazione. Fai clic sull'elemento per aprire il menu mobile, quindi fai clic sull'opzione per modificare il design.

Fai clic sulla scheda Layout per modificare il design della mappa visualizzata sul tuo sito.

Per informazioni sulle opzioni di progettazione non specifiche di questo widget (ad esempio, layout, stile o spaziatura), consulta Design del widget.

Incorporare una mappa di Google utilizzando un widget HTML

Per incorporare mappe da Google Maps utilizzando il widget HTML:

  1. Accedi a Google Maps.

  2. Cerca la località che desideri.

  3. Fai clic sul menu in alto a sinistra, quindi fai clic su Condividi o incorpora la mappa .

  4. Fai clic su Incorpora mappa scheda.

  5. Copia l'URL tra virgolette dopo <iframe src =». Assicurati di copiare l'URL completo racchiuso tra virgolette.

    Google's map interface with a field that lists the embed URL

  6. Accedi al tuo sito e, nel pannello di sinistra, fai clic su Widget e trascina Widget HTML in una riga o colonna.

  7. Usa il seguente codice di incorporamento e aggiungi l'URL ottenuto da Google Maps nelle virgolette dopo iframe src=:

    <div class="embed-container"><iframe src=" " frameborder="0" allowfullscreen></iframe></div>

  8. Vai in modalità sviluppatore.

  9. Clicca HTML/CSS del sito, quindi fai clic su site.css.

  10. Incorpora il seguente CSS in questa sezione:

    .embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

    Developer mode with CSS added

    La mappa verrà ridimensionata in modo appropriato per le diverse visualizzazioni del dispositivo. Se utilizzi il normale codice di incorporamento di Google Maps, la dimensione del widget della mappa apparirà statica su tutti i dispositivi e verrà interrotta nella

    A google maps location shown on three screen sizes: desktop, tablet, and mobile.

Was this article helpful?

Torna in alto