Webflow (Embedding Tools)

Webflow is a web design and development platform that allows users to create responsive websites and web applications without the need for coding. It offers a visual drag-and-drop interface, a variety of templates and design assets, and a powerful content management system (CMS) for creating and managing website content. Webflow also provides hosting services and allows users to export their code for deployment on other platforms.

Integration with Webflow

Step 1: Get the FormWise Code

The first step to embedding a FormWise form is to obtain the code that you want to use. This code can be found from the Home Page > Share on the form you want to embed.

Once you have the FormWise code, you can add it to your Webflow site. Here's how:

1. Open your Webflow project in the Webflow Designer.

2. Select the page where you want to add the iFrame.

3. Drag and drop an Embed element onto the page.

4. Paste the iFrame code into the Embed element.

5. Adjust the width and height of the Embed element to fit the iFrame.

Step 3: Style the iFrame

After you have added the iFrame to your Webflow site, you may want to style it to match the rest of your site's design. Here's how you can style the iFrame:

1. Select the Embed element that contains the iFrame.

2. Use the Style panel to adjust the styling of the Embed element.

3. Use the Custom Code section of the Style panel to add CSS styles that apply to the iFrame itself.

Step 4: Preview and Publish

Once you have added and styled the iFrame, it's time to preview and publish your changes. Here's how:

1. Click the Preview button in the top-right corner of the Designer to preview your changes.

2. Use the preview mode to ensure that the iFrame displays correctly and that its styling matches the rest of your site.

3. Once you are satisfied with the iFrame, click the Publish button to make your changes live on your site.

Conclusion

Embedding an FormWise form into your Webflow site is a straightforward process that can help you display external content on your site. By following the steps outlined above, you can easily add and style a FormWise form to your Webflow site.