Widget Embed Options: Documentation for Customizing your Waitlist

If you've integrated or embedded a Widget, then you have pasted in code similar to this:

Embed Example

<div id="getWaitlistContainer" data-waitlist_id="71"></div>


Beyond setting your Waitlist ID, it is possible to use data- attributes to set more properties.

  • data-default_state="CHECK" will make your Widget such that the primary action is not "Sign Up", but "Check Status" instead.
  • data-signup_email_placeholder_value="abc@example.com" will set the email field in the Widget to abc@example.com. This syntax allows you to, for example, pass in your user's email dynamically so it's easier for them to sign up.

For example, putting it all together, you could have:

Example Code

<div id="getWaitlistContainer" data-waitlist_id="71" data-default_state="CHECK" data-signup_email_placeholder_value="abc@example.com"></div>


Finally, you can of course also set additional classes (or in React, classNames) as an additional attribute. Referring to the example at the start, to make the widget as wide as possible and set it all to bold, you could write:


  .myClass {
    font-weight: bold;
    width: 100%;
<div id="getWaitlistContainer" data-waitlist_id="71" class="myClass"></div>