Embed a Map on Your Website

Type your address, watch the pin land, drag it onto your exact entrance, and copy one iframe line — that's the whole job. Geocoding happens once, right here in the builder: the embed itself ships fixed coordinates, so your visitors load only OpenStreetMap tiles. No API key, no billing account, no cookies, no consent banner, and nothing ever asks them for permission. Got branches? Add up to 10 pins and the map fits them all automatically.

3 · Preview

Set a location above — the live preview appears here.

4 · Copy the code

Set a location first — the snippet appears here.

The URL is for platforms that embed by address instead of HTML — Notion’s /embed block, Google Sites’ Embed ▸ By URL.

Geocoding happened just now, in this builder — the embed itself ships fixed coordinates, loads only OpenStreetMap tiles, sets no cookies, and asks your visitors for nothing. No API key, no consent banner, no permission prompt.

5 · Optional: LocalBusiness structured data

Paste this into the same contact page (inside <head> or anywhere in the body) to tell Google and Bing your exact business location — it can surface your address and map pin directly in search results. Fill the overlay title above with your business name first; add a phone number if you want it shown.

Phone (optional)

Set a location first — the snippet appears here.

Why not just use a Google Maps embed?

For a simple “here is our office” map, the Google routes carry baggage: the JavaScript API needs an API key and a billing account (and a leaked key becomes your bill), while the plain Google iframe loads Google cookies and scripts — which in the EU drags your contact page into consent-banner territory for a map nobody interacts with. This widget uses OpenStreetMap tiles inside a sandboxed iframe: no key, no account, no cookies, no visitor tracking, and if our servers are ever down the iframe fails silently without breaking your page. The trade-off is honest: OSM tiles look a little different from Google's, and there is no Street View — for a contact-page pin, that rarely matters.

WordPress: the shortcode

Our plugin (v1.2+) ships a second shortcode alongside the location widget — download the zip, activate, then drop this into your contact page:

[whatismylocation_map lat="48.858400" lng="2.294500" zoom="16" address="Champ de Mars, Paris" name="Acme SARL" theme="light" height="340"]

Get lat and lng from the builder above — type your address, drag the pin until it sits on your entrance, and read the final coordinates from the box under the map. The map stays exactly where you put it: the shortcode never re-geocodes, so a geocoder hiccup can never move your pin.

Branches (plugin v1.3+): pins="48.8584,2.2945,Head Office|43.2965,5.3698,Marseille" shows up to 10 locations — the map auto-fits and every pin's popup carries its own directions link. Add marker="emerald" (or red, amber, indigo, slate) to match your brand.

Full walkthrough — plugin vs raw iframe, the locations panel, and fixes for shortcodes-as-text, stripped iframes, grey tiles and cache staleness: How to embed a map widget.

The fine print (short and friendly)

Free for any site, commercial or not. The small “powered by” link must stay visible — it is how the free widget pays for itself.
Privacy: the map is static — it shows the location you configured and requests nothing from your visitors. No geolocation prompt, no cookies, no analytics. The only third-party request is the map tiles from openstreetmap.org.
Tiles: map imagery comes from the OpenStreetMap Foundation's public tile servers under their usage policy; the © OpenStreetMap credit on the map must remain visible. If your site serves very heavy traffic, consider a commercial tile provider.
Up to 10 locations per embed. Switch the builder to Advanced and use the “Add location” list — visitors get a clean locations panel (an accordion beside the map on desktop, a swipeable card strip on phones) with numbered pins, per-branch addresses and directions, plus your choice of switch animation. The map fits every branch automatically, your zoom setting becomes the maximum, and each pin’s popup carries its own Get-directions link.

Frequently asked questions

Do I need a Google Maps API key or billing account?

No. The widget uses OpenStreetMap tiles inside a plain iframe — no key, no account, no usage billing, and no quota to run out. Copy the snippet and you're done.

Does the map track my visitors or need a cookie banner?

No. It's a static map: it shows the location you configured, sets no cookies, runs no analytics, and never asks visitors for their location. The only third-party request is the map tiles from openstreetmap.org.

The pin isn't exactly on my building — how do I fix it?

Drag the pin in the builder (or click the map) until it sits on your entrance, then copy the snippet again. The embed uses your final coordinates, not the address text, so the pin can never drift afterwards.

Can I show two or more locations on one map?

Yes — up to 10. Switch the builder to Advanced, position each pin, give it a label and address, and press Add location. Visitors see a locations panel — an accordion beside the map (or a card strip on phones) with numbered pins: picking a branch flies the map to it and shows its address with a Get-directions link. You choose the layout (auto, side, bottom, or none) and the switch animation (smooth, fade, lively, or none). In WordPress: pins="lat,lng,Label~Address|…" (plugin v1.3.2).

How do visitors get directions to my address?

The overlay's Get-directions button opens Google Maps with your exact coordinates pre-filled as the destination — on phones that hands off to their maps app. You can also enable small “Open in Google Maps” / “Open in Apple Maps” icon links (hover tooltips included) on the card and on each branch in the locations panel. With multiple locations, every panel entry carries its own directions link. All of it is switchable in the builder.