How to add a waitlist form to Webflow

Webflow's Code Embed element takes HTML and script tags, so an EarlyTrap form drops into any Webflow page without custom development.

Step 1: Get your embed code

1. Sign in to EarlyTrap and click Create Project. Enter a name and your site's address in the Website URL (Origin) field: the domain only, with no page path, starting with https://www. (for example https://www.yoursite.com). The form only saves emails when the page that shows it is served from that address.
2. Open the project, choose Widget in the sidebar and click Add New Form.
3. Click Config on the new form. Change the placeholder, button text or colors if you like.
4. Click the copy button next to Copy script to embed.

You get a snippet like this. The three IDs are unique to your form; the ones below are placeholders.

<div id="next-subscribe-form-normal"></div>
<script
  src="https://www.earlytrap.com/widget.js"
  data-project-id="YOUR_PROJECT_ID"
  data-widget-id="YOUR_WIDGET_ID"
  data-uid="YOUR_UID"
  async
></script>

Step 2: Add it to Webflow

1. Open your site in the Webflow Designer and go to the page where the form should appear.
2. Open the Add panel, find the Advanced section and drag a Code Embed element into your layout. Placing it inside a Div lets you control its width and spacing like any other element.
3. Open the code editor, paste your whole EarlyTrap snippet and select Save & Close.
4. Publish your site. In the Designer, Webflow shows a placeholder for script tags; the form renders when you preview or publish.

Paste only the snippet. Webflow says not to include <html>, <head> or <body> tags in a Code Embed because they break the page layout.

Official docs: Webflow Help Center: Custom code embed.

If the form does not appear

• Paste both parts of the snippet: the <div> is where the form appears and the <script> loads it.
• Replace the placeholders with the real IDs from Config. If one is missing, the browser console shows "EarlyTrap: missing required data attributes".
• Keep to one EarlyTrap form per page.

If the form appears but signups are not saved

The form shows on any site, but it only saves emails when the page is served from the Website URL (Origin) of your project: same protocol and same domain, including the www. prefix. Check that the project's URL is your site's address without a page path. To confirm that signups are saved, submit a test email and look for it under Emails & Broadcasts in your project.

After you publish

Every signup appears under Emails & Broadcasts in your EarlyTrap project, where you can also send a broadcast to your list. Changes you make in Config apply to a form that is already embedded, so you do not need to paste the snippet again.

FAQ

More guides

• Waitlist widget for your website
• How to create a waitlist for your product launch
• Add a waitlist form to WordPress
• Add a waitlist form to Squarespace
• Add a waitlist form to Next.js