Embed guide

Add a WaitForge signup form to any website in under a minute.

1. Inline embed (recommended)

Drop this into any HTML page. Replace your-slug with your waitlist's slug.

<div data-waitforge="your-slug"></div>
<script async src="https://waitforge.com/embed.js"></script>

That's the whole integration. The script mounts the form, isolates its CSS in a Shadow DOM so your page styles don't leak in, and handles signup, referrals, and Turnstile for you.

Multiple forms on one page

Add more <div data-waitforge="..."> elements — any number. The script mounts all of them.

Dynamic mounting

If you insert the div after page load (React, Vue, Svelte), call window.WaitForge.mount(element) on the new node, or window.WaitForge.init() to rescan the whole page.

2. Iframe embed

When you can't run scripts (Notion, some CMSes), use an iframe:

<iframe
  src="https://waitforge.com/w/your-slug"
  width="100%"
  height="520"
  frameborder="0"
  style="border-radius:12px"></iframe>

Looks identical to the hosted page. Same theme, same referral loop. Height of 520px fits the default form — bump it if you've enabled extra fields.

3. Direct link

No embed at all — just share the hosted URL:

https://waitforge.com/w/your-slug

Best for Twitter, email, push notifications, or anywhere a link is all you have.

Site-builder recipes

Framer

Add an Embed component where you want the form.
Paste the inline embed snippet.
Set the component height to Auto.

Webflow

Add an Embed element (HTML).
Paste the inline embed snippet.
Publish the site — local preview won't run external scripts.

Notion

Notion blocks inline scripts, so use the iframe embed. In a Notion page, type /embed, paste https://waitforge.com/w/your-slug, and resize.

WordPress / Ghost / Substack

Add an HTML block (or "Custom HTML" widget) and paste the inline embed snippet. Works on self-hosted WordPress and Ghost. For Substack, use the iframe embed in a "Button / Embed" block.

Next.js

Load the script once in your root layout and drop the div where you want the form:

// app/layout.tsx
import Script from 'next/script';

export default function Layout({ children }) {
  return (
    <html>
      <body>
        {children}
        <Script
          src="https://waitforge.com/embed.js"
          strategy="lazyOnload"
        />
      </body>
    </html>
  );
}

Then anywhere in your components:

<div data-waitforge="your-slug" />

Customizing the look

The embed widget automatically inherits the theme you set in the dashboard — colors, font, corner radius, and which fields to collect. No CSS overrides from the host site. To change the appearance, edit the theme on your waitlist's Design tab and the change propagates within 60 seconds (edge cache).

Spam protection

Every embed loads Cloudflare Turnstile automatically for invisible bot detection. No configuration on your end. Combined with a honeypot field and IP-based deduplication, you get production-grade protection by default.

Referral tracking

When someone visits /w/your-slug?ref=CODE, the widget auto-detects the ref code from the URL and credits the referrer on signup. Share the URL from the success screen as-is.

Troubleshooting

The form doesn't render. Check your slug. Open devtools and look for 404s on /api/public/your-slug/config.

Styles look off. The widget uses Shadow DOM, so host CSS can't reach in. Edit the theme from the dashboard instead.

Iframe height is wrong. Default 520px fits a standard form. If you've added extra fields, bump to 620 or 720.

"Challenge failed" error. Turnstile blocked the request — usually a VPN or aggressive tracking protection. Disable and retry.