Embed widget

Add a signup form to any website with a single script tag. The widget uses its own branding settings from the Widget editor.

Getting the embed code

1. Go to your waitlist dashboard and open the waitlist you want to embed.
2. Open Widget from the dashboard sidebar.
3. Copy the embed snippet. It has two parts:

<script src="https://getwaitly.com/widget.js" defer></script>
<div class="gw-widget" data-waitlist-id="YOUR_WAITLIST_ID"></div>

Use the waitlist's public ID (or its slug) in data-waitlist-id. The popup variant uses a trigger button instead of the widget <div>.

Pasting on your site

Paste both parts where you want the form to appear on any HTML page. The script can go just before the closing </body> tag; the widget renders a signup form using your Widget editor branding.

The form appears inline where you place the <div class="gw-widget">. To control the position, place that div inside a container with your desired width and alignment.

Platform guides

Carrd

Add an Embed element to your page. Paste the script tag into the embed code box. Set the height to at least 300px.

Webflow

Add an Embed element from the Add panel. Paste the script tag. The widget will render at that spot on your page.

WordPress

Use a Custom HTML block in the editor. Paste the script tag. Some themes may need a Codeblock or a plugin like "Insert Headers and Footers" for global placement.

Framer

Add an Embed component from the Add menu. Paste the script tag into the embed settings.

Next.js / React

Don't drop a raw <script> tag into layout.tsx — use next/scriptso the script loads once and only where it's needed. Render the container <div> on the page where the form should appear, and load the script alongside it:

import Script from "next/script";

export default function Page() {
  return (
    <>
      <div className="gw-widget" data-waitlist-id="YOUR_WAITLIST_ID" />
      <Script
        src="https://getwaitly.com/widget.js"
        strategy="afterInteractive"
      />
    </>
  );
}

afterInteractive (the default) loads soon after hydration. If the form is a secondary element that can wait, use strategy="lazyOnload" to load it during browser idle time. Either way, scope the <Script>to the page or nested layout that renders the form rather than the root layout, so it doesn't load on every route.

The widget fills the container on the client and watches for containers that React adds, so it works with client-rendered routes and won't cause hydration mismatches.

What the widget looks like

The widget renders a signup form with an email input and any contact fields or questions you added, plus a submit button. It uses the accent color and font from the Widget editor. When someone signs up, they see a success message with confetti and their queue position.

Consent checkboxes

For CASL or GDPR-style opt-in, add a question and choose Consent checkbox. The checkbox is unchecked by default. A required consent checkbox blocks signup until it is checked; an optional one allows signup and stores No.

The response is stored as Yes or No with a timestamp and the consent text. It appears in subscriber details and in the CSV export, which includes extra consent timestamp and consent text columns.

Limitations

• The Mini and Docked display types collect email only; other questions and terms are hidden. Consent checkboxes still render below the email field.
• The widget has its own colors, font, and radius in the Widget editor, separate from your hosted page. The logo is shared with the rest of your waitlist from Settings.

See it running live on the demo product page.