Embed Quickstart
Get your map live on a website in under a minute.
Prerequisites
Before embedding, make sure your map is published. Toggle the Published switch in your map settings -- unpublished maps won't load in embeds.
Embedding your map
Include the Mapsemble widget script once and add a div element where you want the map to appear:
<script src="https://app.mapsemble.com/widget.js"></script>
<div data-mapsemble-map="YOUR_MAP_ID"></div>
Replace YOUR_MAP_ID with your map's slug or ID, which you can find in the Embed dialog in your dashboard.
The widget automatically renders a fully interactive map inside the div. This approach works well when you need to place multiple maps on a single page or want more control over the container element.
URL parameters
You can pass parameters to customize the embedded map's behavior:
| Parameter | Description | Example |
|---|---|---|
language |
Set the map's display language | ?language=es |
Apply parameters to the embed URL via data-mapsemble-params:
<div data-mapsemble-map="YOUR_MAP_ID" data-mapsemble-params="language=es"></div>
Domain whitelist
For security, you can restrict which websites are allowed to embed your map. Configure the list of allowed domains in your Map Settings > Embedding section.
When a domain whitelist is configured, the embed will only load on pages served from those domains. If no whitelist is set, the map can be embedded on any website.
Responsive sizing
The widget automatically sizes itself to fill the parent container. Set the container's width and height via CSS to control the map's dimensions.
Next steps
- Embedding Configuration -- Advanced embedding options, custom parameters, and event handling