Embed your online forms on Webflow
Webflow is one of the fastest growing no-code website builders you can find. Combine their beautiful designs with MightyForms's powerful forms to capture more leads and automate workflows.For every form you publish, MightyForms provides a short embed code that you can copy & paste into your Webflow page using the custom code Embed element.
Let's break that down into step-by-step!
1. Select the form you want to embed
Once you are logged into the MightyForms app, you can either:
- Select an existing form from your dashboard
- Create a new form from scratch
- Select one of the Templates.
- Or Transfer an existing form
Make all the necessary design edits, connect app integrations, and set up any automation you need.
2. Publish the form
You can publish your Mighty form with just a click. On the upper right corner of your page, you'll see the button 'Publish', click it.
A success message will appear on the upper right corner, confirming that your form is published.
And if you go to your form's dashboard, you'll see that it's labeled as published.
Only after you publish a form can you share, embed it on a webpage, or embed it in an email.
3. Copy embed code
A pop-up window will show the options on how you can share the form.
On the right side of the Share dashboard, you'll see the embed code. Click 'Copy'.
Select a Webflow page
Login to your Webflow account.
Open the Designer for the selected Webflow project.
Select the page where you want to embed the form.
Add an Embed element
Use quick find (CMD/CTRL+E) and type embed or drag an embed element from the Add panel.
Webflow has different steps depending on how you want add your Form.
Directly into your design:
Paste your form's embed code in the HTML Embed Code Editor and hit 'Save'.
Add the Form in a rich text element
Hover your cursor where you’d like to add custom code on your page, then click the plus sign to open the insert menu and click the custom code button. Paste the Form's embed code.
Preview the Form: The Form will only be visible on the live site. While you are editing you will only see this message: