iframe

Embed an interactive map on your website

Make a DotMap public (or by link), then drop it into your page with an iframe. Visitors get pins, event cards, photos, and a chronology without leaving your site. No map API key and no Leaflet setup.

Create a map to embed Live example

One iframe

Paste HTML. The frame loads a chrome-free map. Replace YOUR-MAP with the slug from the map link, or copy the snippet in studio settings.

WordPress, Tilda, Webflow

Any block that accepts custom HTML: blogs, city guides, school pages, news, event sites.

Same map, two ways

Share /maps/… as a link. Embed /maps/…/embed — map only, no DotMap header. Studio edits show up in the frame.

Not private

A private map shows nothing useful in the frame. Switch to By link or catalog first.

How to embed a DotMap

1
Build the map
Add pins, dates, and media — or import CSV / JSON.
2
Open access
Not private. Copy the iframe from studio settings.
3
Paste the iframe
Drop the snippet into a custom HTML block. Height at least 480px.

Iframe snippet

<iframe
  src="https://dotmapapp.com/maps/YOUR-MAP/embed"
  title="Interactive map"
  width="100%"
  height="560"
  style="border:0;border-radius:12px"
  loading="lazy"
  referrerpolicy="strict-origin-when-cross-origin"
  allow="fullscreen; geolocation"
  allowfullscreen>
</iframe>

A live page that already uses this snippet: iframe example.

FAQ

How do I embed an interactive map without an API key?

Make the map not private and paste an iframe at https://dotmapapp.com/maps/your-map/embed. No Google Maps or Mapbox key.

Will the iframe work on mobile?

Yes. Width 100% and a fixed height around 560px. The map zooms inside the frame.

Can I embed a private map?

No. Viewers will not see it.

Does the embed update when I edit the map?

Yes. The iframe loads the live public map.