Platforms

Embed a map in Framer

Framer sites are perfect for lightweight embeds. Paste an iframe and you'll get a responsive map that visitors can search and filter.

Embed a Map in Framer (Interactive, Responsive)
1,200+
Maps created
85k+
Locations mapped
<5 min
Avg. setup time

How it works

1
Publish
Publish the map in MapsMaker.
2
Copy embed code
Share → Embed.
3
Add to Framer
Insert an Embed component and paste the iframe.

Framer embed pattern

Framer's component model makes embeds straightforward. Drop in an Embed component, set your constraints, and the iframe will adapt across breakpoints just like any other element on the page.

Use an Embed component and paste the iframe
Set constraints so it stretches width-wise across breakpoints
Pick height based on the UX you want (600 minimal, 800 comfortable)

Best use cases for Framer sites

Framer sites tend to be polished and visually driven, which makes them a great fit for maps that double as a browsing experience. These are the patterns that work best.

Directories
Neighborhood guides
Product locators

Framer tip: keep it responsive

Responsive maps in Framer just need the right container settings. If you lock the width to fill and set a fixed height, the embed will look good on desktop and collapse gracefully on mobile.

Set width to fill container and lock a sensible height
If you wrap the embed in a component, ensure overflow isn't clipping it

Frequently asked questions

Does it work in Framer CMS?
Yes—place it in your CMS template.
Can visitors filter pins?
Yes—filters work in public/embed views.
Can I remove branding?
Yes—on eligible paid plans.
Is MapsMaker free?
There's a free plan for trying it out. Paid plans start at $15/month with a 7-day free trial. No credit card required to start.
How long does setup take?
Most teams go from signup to a published, embedded map in under 10 minutes.
Create your map in minutes
Start with a template, import locations if you have a spreadsheet, and publish a link or embed.

Related resources