Framer integration
A social media widget that respects your Framer stack.
Framer sites are usually built by people who will notice a four-pixel misalignment, so the question is not whether a social media widget works but whether it behaves inside a stack. It does — once you know where to put it.
Inside a stack, not floating on the canvas
Framer's layout is stack-based, and an embed that sits outside one will not participate in the layout you built.
An Embed layer inside a section stack
It then respects the stack's gap, padding and alignment like any other layer, and moves when you reorder the section.
Set to fill width, hug or fixed height
Fill width is almost always right. Height depends on the layout you picked — a carousel wants fixed, a wall wants room.
Site settings — custom code, end of body
Only for a floating launcher. Anything in the page flow belongs in an Embed layer.
Not inside a component you reuse everywhere
Unless you genuinely want the same wall on every page — Framer will faithfully put it everywhere that component appears.
Adding it to Framer
- 1
Insert an Embed layer
From the insert menu, add Embed and place it inside the stack where the wall belongs.
- 2
Choose HTML rather than URL
The Embed layer accepts either. Pick HTML and paste both lines of the snippet.
- 3
Set sizing on the layer
Fill width, and give it enough height for the layout you chose. Check the tablet and phone breakpoints — Framer keeps per-breakpoint sizing.
- 4
Publish and open the live URL
The canvas may show a placeholder. Framer runs embedded code on the published site, not while you are designing.
What trips people up on Framer
Framer is one of the smoother platforms for this. The issues that do come up are about layout rather than about code.
- An Embed placed on the canvas rather than inside a stack, which then ignores your section's padding and gap
- Fixed height set for desktop and never checked on the phone breakpoint, where the wall needs more vertical room
- Judging it from the canvas instead of the published site
- Putting the Embed inside a shared component and then finding the wall on every page of the site
Framer questions
Usually you will see a placeholder while designing. Framer executes the embed on the published site — open the live URL to check it properly.
Other platforms
One snippet, then never again.
Build the feed, paste it into Framer once, and it keeps itself current from then on.
Start free