Incrustar Google Maps en tu sitio web permite a los usuarios acceder fácilmente a información de ubicación, mostrar un marcador en una dirección específica y navegar utilizando funciones como indicaciones y Street View. También mejora tu SEO local.
Incrustar Google Maps manualmente mediante código
Siga los pasos a continuación para incrustar Google Maps manualmente o mediante widgets de WordPress. Así es como funciona:
- Abrir Google Maps
- Haz clic en Compartir y Incrustar un mapa y Copiar el Código de Inserción
- Pega el código de inserción en el HTML de tu sitio web
Paso 1: Abre Google Maps
Ir a https://www.google.com/maps/ y busca la ubicación deseada en la barra de búsqueda. Puedes ubicar la dirección de tu negocio, ver un destino o cambiar a la vista satelital para obtener más detalles.
Paso 2: Generar el código de inserción
- Haz clic en Icono de compartir en la interfaz del mapa.
- En el Ventana para compartir, selecciona la pestaña “Insertar un mapa”.
- Copia lo proporcionado código de inserción (iframe).
Paso 3: Pega el código de inserción en el HTML de tu sitio web
- Abre tu código HTML archivo usando cualquier editor de código o abra su página de WordPress y seleccione un widget HTML.
- Localiza la sección donde quieras que se muestre el mapa y pega el código iframe.
- Guarda los cambios y actualiza tu página web para ver el mapa incrustado.
Ejemplo de código de inserción de iframe:
Copiar código Copiado Usa un navegador diferente<code id="dm-code-raw" class=" no-wrap language-markup"><iframe src="https://www.google.com/maps/embed?..." width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe></code>
Haciendo que el mapa sea responsivo
Para garantizar que el mapa se vea bien en todos los tamaños de pantalla, puedes envolver el iframe en un contenedor con CSS:
Copiar códigoCopiadoUsa un navegador diferente<code id="dm-code-raw" class=" no-wrap language-markup"><div style="position:relative; padding-bottom:56.25%; height:0; overflow:hidden;"> <iframe src="https://www.google.com/maps/embed?..." style="position:absolute; top:0; left:0; width:100%; height:100%; border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe> </div></code>
Incrustar Google Maps Usando Constructores de Páginas de WordPress
La mayoría de los constructores de páginas de WordPress, como Elementor, Divi o WPBakery, incluyen un Google Maps widget. Este método simplifica el proceso y elimina la necesidad de codificación manual. Los widgets suelen ofrecer opciones de personalización como niveles de zoom, tipo de mapa (predeterminado, vista satélite, etc.) y personalización de marcadores.
Por ejemplo, en Elementor puedes incrustar un mapa de Google Maps mediante:
- Buscando el Mapas widget
- Arrastrando el Mapas widget en tu página
- Escribiendo el nombre de la ubicación de tu negocio
Como usuario de WordPress, también podrías querer aprender más sobre Cómo hacer SEO en WordPress!
Problemas comunes y solución de problemas
- Mapa no se muestra: Verifique que el código del iframe se haya copiado y pegado correctamente.
- Problemas con la clave API: Algunas funcionalidades avanzadas pueden requerir un Clave de API para la integración.
- Restricciones del navegador: Asegúrate de que tu sitio permita iframes y no tenga plugins ni scripts en conflicto.
Preguntas frecuentes
¿Puedo incrustar Google Maps en mi sitio web de forma gratuita?Sí, puedes incrustar Google Maps gratis utilizando el código de inserción iframe proporcionado por Google Maps.
¿Incrustar Google Maps ayuda al SEO?Sí, incrustar Google Maps puede mejorar el SEO local al proporcionar datos de ubicación claros y mejorar la experiencia del usuario.
Conclusión
Insertar Google Maps es una forma sencilla de mejorar tu sitio web. Ya sea que optes por código manual o por un widget de WordPress, estarás proporcionando a tus visitantes información valiosa sobre la ubicación y mejorarás la funcionalidad de tu sitio web. Para usuarios de WordPress, asegúrate de consultar nuestro tutorial enlazado para obtener instrucciones paso a paso sobre cómo usar los widgets de Google Maps.
I’m an experienced SEO professional with over a decade of helping over 100 businesses rank higher online, especially local businesses, e-commerce stores and SaaS. As the co-founder of LPagery, I specialize in practical, proven strategies for regular SEO and Local SEO success.
blog.affiliateDisclaimer
I’m an experienced SEO professional with over a decade of helping over 100 businesses rank higher online, especially local businesses, e-commerce stores and SaaS. As the co-founder of LPagery, I specialize in practical, proven strategies for regular SEO and Local SEO success.