Embed a form in Webflow
Webflow takes the embed code as it is. You paste it into a Code Embed element, and the form shows inside your page.
The Code Embed element is available on a Workspace on Core, Growth, Agency or Freelancer, or on a site with an active Site plan.
1. Copy the embed code
In Formstep, open the Public link sheet, click the Embed card, then Copy embed code.
2. Add a Code Embed element
In the Webflow Designer, open the Add panel and add a Code Embed element where the form should sit.
- Paste the code.
- Save and close the code editor.
The embed is as wide as the element it sits in. Its height is the one you set in Formstep.
What the Designer shows
With Auto-resize height off, Webflow previews the form on the canvas. With it on, the code holds a script, and the Designer shows a placeholder. The script runs once you preview or publish the site, so check the height on the published page.
Open the form as a popup
Click the Popup card in the Public link sheet and copy the popup code. Paste it into a Code Embed element anywhere on the page. The Designer shows a placeholder for it.
With the trigger Automatically on page load, nothing more is needed. To open it from a button, add the button to the same Code Embed, with the function name from the comment in your code:
<button onclick="window.openFormstepPopup_Abc12XYz()">Open the form</button>If the form does not show
Look at the published page: a script never runs on the canvas. If the Add panel has no Code Embed element, the Workspace or site plan does not include it.