Embed · Webflow CMS collections
Embed a demo per CMS item in Webflow.
One Embed element on a Webflow Collection page template plus a URL field per item gives every CMS entry its own interactive demo — exact steps, the Add Field trick, and the limits.
Where it goes: Collection page templates — one demo per feature page, per integration page, or per customer story, driven from the CMS.
The snippet
One iframe
The share modal generates this for your lane; the example uses a placeholder address. Webflow CMS collections needs the variant below it.
<iframe src="https://acme.tellane.com/l/pipelines-tour" width="100%" height="640" frameborder="0" allowfullscreen></iframe>
<iframe src="ADD FIELD → Demo URL" width="100%" height="640" style="border:0" allowfullscreen loading="lazy" title="Interactive demo"></iframe>
Steps
In Webflow CMS collections
- In the Webflow CMS, add a Plain Text (or Link) field to the Collection — call it Demo URL — and paste each item's lane link into it.
- Open the Collection page template in the Designer and drag an Embed element (custom code) where the player belongs.
- In the embed's code editor, type the iframe with an empty src, then place the cursor inside src="" and use + Add Field → Demo URL to inject the field.
- Set width="100%" and height="640" on the iframe as usual and save the embed.
- Publish and open two different collection items — each should load its own lane.
Proof
This is what the embed looks like
A lane embedded on this page, the same way yours will be on Webflow CMS collections. Drive it.
If it doesn't work
What breaks, and the fix
- Items without a Demo URL render a broken frame. In the Element settings, add a condition to show the embed only when Demo URL is set — Conditional Visibility on the Embed element.
- The embed shows a placeholder in the Designer. Custom code renders on the published site, not the canvas. Publish to verify.
- Webflow rejects a very long embed. Custom code embeds cap at 50,000 characters — nowhere near a one-line iframe; if you hit it, something else was pasted in.
- The player is letterboxed or cut off on phones. Keep width="100%" and set height to 640 on desktop; for a fixed 16:10 box wrap the iframe in a div with aspect-ratio: 16 / 10 and give the iframe height: 100%.
- A 'Made with Tellane' badge shows on the demo. Free-plan lanes carry the badge; Growth removes it under Settings → Workspace.
FAQ
Questions
Does this need a site plan?
Publishing custom code and CMS collections needs a paid Webflow site plan with CMS — which a CMS-driven site already has.
Other platforms