Añade tu ruta y tus notas a tu sitio web

Un mapa insertado convencional muestra un marcador, pero eso no ayuda a un invitado a encontrar la entrada lateral, a un visitante a seguir el camino desde la estación ni a un cliente a saber dónde haces entregas. Draw on a Map te permite dibujar primero esos detalles e insertar después el mapa terminado. No necesitas una clave de API ni una cuenta.

Crea el mapa y copia el código de inserción

1. Abre Draw on a Map y busca tu ubicación.
2. Dibuja la ruta, la zona, las flechas o las notas.
3. Ajusta el zoom y desplaza el mapa hasta obtener la vista que quieres que los visitantes vean primero. El mapa insertado se abre con esa vista.
4. Selecciona el botón Insertar (</>) de la barra de herramientas superior.
5. Elige dónde vas a pegar el código: HTML, WordPress, Wix o Squarespace. El cuadro de diálogo muestra los pasos para esa plataforma.
6. Ajusta la altura y selecciona Copiar código.
7. Pega el código en tu página, publícala y compruébala en un ordenador y en un móvil.

En WordPress, pega el código en un bloque HTML personalizado. En Wix, añade Insertar código → Insertar HTML. En Squarespace, añade un bloque Código configurado como HTML.

Cómo es el código

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

Esto es una plantilla. Copia el código real del cuadro de diálogo Insertar este mapa, que rellena el atributo src correspondiente a tu mapa. El ancho se ajusta a la columna que lo contiene. Cambia height si tu página necesita un mapa más alto o más bajo.

Los mapas insertados gratuitos muestran «Desarrollado por Draw on a Map». Para quitar ese texto, guarda el mapa y pásate a Pro.

Mantén actualizado el mapa insertado

Guarda el mapa en tu cuenta antes de copiar el código. Así, el mapa insertado mostrará la última versión guardada y podrás corregir una ruta o mover un marcador sin modificar tu sitio web.

El código copiado de un mapa sin guardar almacena el dibujo en la URL y no cambia cuando editas el mapa. Después de una modificación, abre Insertar de nuevo, copia el código nuevo y sustituye el iframe anterior.

Los conjuntos de datos importados de gran tamaño no caben en una URL. Si el cuadro de diálogo Insertar este mapa te pide que guardes primero, guarda el mapa y abre Insertar de nuevo.

Si el mapa no aparece

Usa un bloque que admita HTML o código iframe. Un campo que solo acepte una dirección web no funcionará con el iframe completo. Si el mapa desaparece después de publicar la página, es posible que tu creador de sitios web esté eliminando los iframes. Revisa sus ajustes de contenido insertado.

Ideas de mapas para sitios web

• Eventos y bodas: señala la entrada correcta, la parada del autobús de traslado y el aparcamiento en un solo mapa.
• Alquileres y viajes: dibuja el recorrido a pie desde la estación hasta el apartamento o el atajo para llegar a la playa.
• Empresas de servicios: dibuja la zona que cubres. Si los visitantes necesitan comprobar su propia dirección, el Service Area Widget de pago convierte ese límite en un comprobador de direcciones para tu sitio web.

Crea el mapa para tu sitio web

Guías relacionadas

• Dibujar un círculo en un mapa: señala una zona de reparto o de servicio con un radio exacto
• Dibujar en Google Maps: traslada un mapa existente de Google My Maps antes de insertarlo
• Compartir indicaciones personalizadas a pie: dibuja una ruta que una aplicación de navegación calcula mal