Developers · Widget

The checklist, on your page.

If you would rather keep attendees inside your own product than link out, drop the checklist in where you want it.

Install

<div id="ewent-checklist"
     data-event="EWENT_TOKEN"
     data-rsvp="RSVP_TOKEN"></div>

<script src="https://ewent.ai/widgets/checklist/checklist.js" defer></script>

The script finds the container, fetches that attendee’s steps, and renders them. Ticking a box posts straight back to ewent — the same state the emails and the hosted page use.

Attributes

Attribute	Required	What it does
`data-event`	Yes	The occurrence token.
`data-rsvp`	Yes	The attendee token. Render it server-side — don’t derive it in the browser.
`data-phase`	No	Pin to `prep`, `live` or `post`. Defaults to the event’s current phase.
`data-theme`	No	`inherit` (default) adopts your host page’s fonts and colours; `ewent` uses ours.

Styling

In inherit mode the widget sets almost nothing and takes your typography. Override the rest with CSS custom properties on the container:

#ewent-checklist{
  --ew-accent:#BC1558;     /* ticks, progress */
  --ew-ink:#1D1C1D;        /* step titles */
  --ew-muted:#555F77;      /* secondary text */
  --ew-rule:#E8E8EC;       /* borders */
  --ew-radius:14px;
}

Security

The widget reads and writes only the one attendee identified by data-rsvp.
Render tokens server-side. A token in client-side JavaScript that any visitor can read is a token any visitor can use.
The endpoints send their own CORS headers, so no proxy is needed.
If you set a Content-Security-Policy, allow ewent.ai in script-src and connect-src.

Live example

A working embed on a third-party page: thirdparty_checklist.html — view source, it is the snippet above and nothing else.

One honest caveat. There is more than one widget build in the codebase right now while we consolidate. The path above is the one to integrate against; if you find another in an older README, use this one.

API quickstart Request a key