Styling & embedding

Test an embed before it goes live

All guides

An embedded map depends on two things being right: the map is published, and your website's domain is allowed to embed it. Miss either and visitors see a blank or "refused to connect" frame. Run this short check before the page goes live.

Before you test

  1. Publish the map

    The embed link only works once the map is published. If the Embed tab says Publish the map to get its public link, publish first.

  2. Allow your website's domain

    By default no other website can embed your maps — only your own Mapvera pages. A team admin must add your site under Team Settings → Embedding, one domain per line.

    Subdomains need their own line, or use *.example.com to cover them all. Allow-list changes take about 15 seconds to apply.

  3. Copy a fresh snippet

    Copy the code from the Embed on Your Site tab. Use the current one — an old snippet may point at a renamed map.

Test it

  1. Try it on a staging or draft page first

    Paste the snippet into an unpublished page or a staging copy of your site. The domain still has to be on the allow-list, so use the real hostname where you can.

  2. Load the page and watch the map appear

    The map should render inside your layout and be pannable. If you see a blank frame or "refused to connect", the site's domain isn't on the allow-list — check the exact domain (including www. or a subdomain) and add it.

  3. Check a share / deep link

    If you've set a share-URL override, open one of your ?location=… links and confirm the embedded map opens on the right landmark.

  4. Test the permissions

    Go fullscreen from inside the map, and if your maps use GPS, allow location and confirm the blue dot appears. The snippet already grants fullscreen and geolocation; a browser may still prompt the visitor.

  5. Check it on a phone

    Open the same page on a real phone. Confirm the frame height suits the small screen and the bottom sheet has room — adjust the wrapper size if it feels cramped.

Common problems

SymptomLikely cause & fix
Blank frame / "refused to connect"The page's domain isn't on the Embedding allow-list — add the exact domain in Team Settings.
"Publish the map to get its public link"The map isn't published yet — publish it, then re-copy the snippet.
Map loads but wrong landmark opensCheck the ?location= value matches the landmark's ID.
Map is squashed or letterboxedThe wrapper ratio doesn't match the artwork — adjust padding-top (see the responsive-sizing guide).
Only once the map loads cleanly on the real hostname, opens the right landmark, and looks right on a phone should you publish the page to your visitors.