Embedding in Webflow

Using an Embed element

<fav-form data-embedId="your-form-id"></fav-form>
<script src="https://favform.com/embed/v1.js" async></script>

Site-wide widgets

Add a feedback widget to every page using Project Settings:

1. Go to Project Settings → Custom Code
2. In the "Footer Code" section, paste the widget code
3. Save and publish

<fav-form data-embedId="your-widget-id"></fav-form>
<script src="https://favform.com/embed/v1.js" async></script>

Page-specific code

To add code to a specific page only:

1. Select the page in the Pages panel
2. Click the gear icon to open Page Settings
3. Scroll to "Custom Code"
4. Add your code to "Before </body> tag"

Responsive design

Make your embed responsive across breakpoints:

• Set width to 100%
• Use different heights for desktop/tablet/mobile breakpoints
• Consider using a container with max-width for better readability

/* Example: Add to an Embed element's custom CSS */
.favform-container {
  width: 100%;
  max-width: 700px;
  margin: 0 auto;
  min-height: 600px;
}

Using iframe

For simpler embedding or if you have issues with the script:

<iframe 
  src="https://favform.com/f/your-form-id" 
  width="100%" 
  height="700" 
  frameborder="0" 
  style="border: none;">
</iframe>

Webflow interactions

You can trigger form visibility with Webflow interactions:

1. Wrap the Embed in a Div with display: none
2. Create an interaction that shows the Div on button click
3. This creates a modal-like form experience

Troubleshooting