¿Qué es el código para insertar Google Maps?
El código para insertar Google Maps es un elemento HTML <iframe> que muestra un mapa interactivo dentro de una página web. Los visitantes pueden desplazarse, ampliar el mapa, consultar un lugar y explorar los alrededores sin salir de tu sitio.
A diferencia de una imagen estática, el iframe carga un mapa funcional. Es una solución práctica para páginas de contacto, fichas de negocios locales, inmobiliarias, eventos, hoteles, restaurantes y cualquier web que necesite indicar una ubicación.
Cómo generar un iframe de Google Maps
El generador crea el código de inserción sin que tengas que escribir HTML. Introduce una dirección o unas coordenadas, elige el tipo de mapa, ajusta el zoom y define el tamaño. La vista previa se actualiza para que puedas comprobar el resultado antes de copiarlo.
- Introduce una dirección, un negocio, unas coordenadas o un mapa público de My Maps.
- Ajusta el zoom, el tipo de mapa, la anchura y la altura.
- Activa el diseño responsive, la carga diferida y la pantalla completa si los necesitas.
- Pulsa «Generar código» y pega el iframe en el HTML de tu página.
Mapa de Google responsive y de ancho completo
Un mapa responsive se adapta al espacio disponible en ordenadores, tabletas y móviles. La opción responsive del generador envuelve el iframe en un contenedor que conserva la proporción y evita el desplazamiento horizontal.
Para un mapa de ancho completo, usa una anchura del 100 %. Comprueba la vista previa para móvil y elige una altura suficiente para que los controles del mapa sean fáciles de utilizar sin ocupar toda la pantalla.
Insertar Google Maps sin clave API
Un mapa estándar compartido mediante iframe normalmente se puede insertar sin crear una clave de Google Maps Platform. Este método es adecuado cuando solo necesitas mostrar una ubicación, una vista del mapa, una ruta o un mapa público de My Maps.
Una clave API es necesaria para integraciones programadas con JavaScript, datos dinámicos, marcadores creados por código o funciones avanzadas de Google Maps Platform. Para una inserción sencilla, el iframe reduce la configuración y evita cargar JavaScript personalizado.
Rutas, coordenadas y marcadores personalizados
Activa el modo de indicaciones para generar un mapa con origen y destino. También puedes usar latitud y longitud cuando una dirección postal no identifica el lugar con precisión, por ejemplo en miradores, senderos, fincas o puntos de encuentro.
Si necesitas varios marcadores, colores o capas, crea un mapa público en Google My Maps y pega su URL de inserción o su iframe en el generador. Así conservas la personalización de My Maps dentro del código final.
Añadir Google Maps a WordPress, Shopify, Wix y otras plataformas
En WordPress, añade un bloque «HTML personalizado» y pega el código. En Shopify, utiliza una sección Liquid personalizada o el editor HTML de una página. En Wix, Webflow y Squarespace, usa el bloque de código o de inserción correspondiente.
Después de publicar, revisa la página en móvil y ordenador. No pegues el iframe en un campo que solo admita texto: debe ser un bloque que permita HTML. La carga diferida ayuda a que el mapa no compita con el contenido visible al abrir la página.