Documentation
    Platforms

    Webflow Forms: HTML Embed Setup

    Replace Webflow's built-in form with an HTML Embed that posts to a Formboost endpoint: spam screening, email, Slack and webhooks, no Webflow form limits.

    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:

    https://formboost.app/f/YOUR_ENDPOINT_ID

    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:
    <form action="https://formboost.app/f/YOUR_ENDPOINT_ID" method="POST" class="fb-form">
  <input type="text" name="name" placeholder="Your name" required />
  <input type="email" name="email" placeholder="Email address" required />
  <textarea name="message" placeholder="Your message" rows="5"></textarea>
  <button type="submit">Send Message</button>
</form>

<style>
  .fb-form { display: flex; flex-direction: column; gap: 12px; max-width: 480px; }
  .fb-form input,
  .fb-form textarea { padding: 10px 14px; border: 1px solid #ccc; border-radius: 6px; font-size: 15px; font-family: inherit; }
  .fb-form button { padding: 12px 24px; background: #000; color: #fff; border: none; border-radius: 6px; font-size: 15px; cursor: pointer; }
</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>:

    <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

    Written by · Last updated

    WordPress Forms: Custom HTML Block Setup

    Add a contact form to WordPress with a Custom HTML block and a Formboost endpoint — no Contact Form 7 or WPForms, no plugin, spam screening built in.

    Framer Forms: Code Component Setup

    Collect submissions from a Framer site with a Code Component or embed that posts to a Formboost endpoint: fields, redirect, spam screening, notifications.

    On this page

    PrerequisitesStep 1: Create a Formboost EndpointStep 2: Add an HTML Embed in WebflowStep 3: Style to Match Your DesignStep 4: Custom Redirect (Optional)Step 5: Test ItNext Steps