Adding a Form to Webflow

Webflow has a built-in form component, but it stores submissions inside Webflow and has limited integration options. With Formboost, you get AI spam filtering, webhooks, a REST API, and a searchable submission dashboard — using a custom HTML Embed element.

Prerequisites

• A Formboost account (sign up free)
• A Webflow site (any plan that includes custom code embeds)

Step 1: Create a Formboost Endpoint

Log in to your Formboost dashboard and create a new endpoint. Copy the endpoint URL:

Step 2: Add an HTML Embed in Webflow

1. Open your page in the Webflow Designer
2. In the left panel, go to Add Elements → Components → Embed
3. Drag the HTML Embed element onto your page
4. Click the element and select Open Embed Code
5. Paste the following:

1<form action="https://formboost.app/f/YOUR_ENDPOINT_ID" method="POST" class="fb-form">
2  <input type="text" name="name" placeholder="Your name" required />
3  <input type="email" name="email" placeholder="Email address" required />
4  <textarea name="message" placeholder="Your message" rows="5"></textarea>
5  <button type="submit">Send Message</button>
6</form>
7
8<style>
9  .fb-form { display: flex; flex-direction: column; gap: 12px; max-width: 480px; }
10  .fb-form input,
11  .fb-form textarea { padding: 10px 14px; border: 1px solid #ccc; border-radius: 6px; font-size: 15px; font-family: inherit; }
12  .fb-form button { padding: 12px 24px; background: #000; color: #fff; border: none; border-radius: 6px; font-size: 15px; cursor: pointer; }
13</style>

Replace YOUR_ENDPOINT_ID with your actual endpoint ID.

Step 3: Style to Match Your Design

Edit the <style> block in the embed to match your Webflow site's colors and fonts. Since it's scoped to .fb-form, it won't affect other elements.

Step 4: Custom Redirect (Optional)

To send users to a custom thank-you page after submission, add a hidden field inside the <form>:

1<input type="hidden" name="_redirect" value="https://yoursite.webflow.io/thank-you" />

Step 5: Test It

Publish your Webflow site and submit the form. The submission will appear in your Formboost dashboard and trigger an email notification.

Next Steps

• Configure notifications and spam filtering
• Read submissions via the API