Divi: come integrare una mappa di Google Maps senza una chiave API?

Tema Divi - Incorpora mappe di Google
- Banner

Vuoi integrare una mappa di Google Maps nel modo più semplice possibile? Lavorando con un semplice codice HTML del Divi Builder, questa soluzione consente di rinunciare alla procedura per ottenere una chiave API.

1. Vai su Google Maps

Dovresti quindi trovare la posizione esatta che desideri condividere sul tuo sito Web e ingrandire fino a visualizzare chiaramente la posizione sulla mappa.

2. Pulsante “Condividi”.

Fai clic sul pulsante del menu “Condividi” in alto a sinistra dello schermo per visualizzare l’opzione, quindi fai clic sull’opzione “Incorpora una mappa”.

Tema Divi - Pulsante Condividi di Google Maps

3. Finestra “Condividi”.

Si aprirà quindi una finestra in cui vedrai due schede denominate “Invia un collegamento” e “Incorpora una mappa”. Scegli la scheda “Incorpora una mappa” e lì troverai un codice HTML.

Tema Divi - Pulsante Condividi di Google Maps

Copia questo codice HTML facendo clic su “COPIA CONTENUTO HTML”:

Tema Divi - Pulsante Condividi di Google Maps

Ecco cosa rappresenta questo codice, che varia in base alle posizioni di Google Maps:

<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3456.0066415390556!2d31.132007850800175!3d29.979239128515893!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x14584587ac8f291b%3A0x810c2f3fa2a52424!2sPyramide%20de%20Kh%C3%A9ops!5e0!3m2!1sfr!2ses!4v1645881660798!5m2!1sfr!2ses" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy"></iframe>

4. Vai al tuo sito web

Ora vai al tuo sito web dove vuoi visualizzare la mappa. Devi incollare il tuo codice Html nel modulo CODE di Builder (Contenuto > Testo). Convalidare. La mappa verrà quindi visualizzata sulla tua pagina:

Tema Divi - Modulo CODICE
Tema Divi - Modulo CODICE

5. Regolazione delle dimensioni della mappa

Puoi facilmente modificare la dimensione della mappa modificando manualmente i valori di “larghezza e “altezza” contenuti nel codice HTML che hai appena ottenuto.

Tema Divi - Modulo CODICE

Ulteriori suggerimenti sono disponibili qui .

image 100314455 13805217



Philippe

Have a Passion about Technology, Photography and Writing. Codetahiche.com is my personal blog about WordPress Plugins, WordPress Themes, VPN and Web Hosting.

Lascia un commento