What's on, with no code

The paste-in widget sells dates on any page you can add HTML to: a plain site, WordPress, or a CMS block. Add a tag where the tickets should appear, and the widget script once per page:

<script src="https://app.seatlayer.io/sl-event-widget@0.js" defer></script>

The buyer chooses seats on your page and pays through SeatLayer checkout. A gateway that redirects brings them back to the same page with data-return-url="page".

One date

<div data-seatlayer-event="EVENT_KEY" data-layout="picker" data-checkout="hosted" data-return-url="page"></div>

data-layout can also be card, banner or button, which open the seat map when the buyer clicks Book now.

A run of dates

For repeat showings made as an event series, one tag lists the run’s dates on sale. The buyer picks a date, and that date’s seat map opens in its place:

<div data-seatlayer-series="SERIES_KEY" data-return-url="page"></div>

• The tag lists a date when its own sales are open, it hasn’t started, and it is public. An unlisted date is for people you send its link to, so it is never listed. A date that sells only on your website is listed there: on the website you declared for embeds, not anywhere else. A cancelled season date is never listed. Up to 60 dates, in date order. A longer run shows its first 8 dates and a “Show all” button, so the list doesn’t take over the page.
• The list uses the widget’s own look: data-theme and data-accent work as they do on a single date.
• data-title replaces the run’s name; data-button-text the “Book now” label. When nothing is on sale the run’s name isn’t shown, only that no dates are on sale (and your data-title, if you set one).
• data-return-url, data-theme, data-accent, data-locale, data-height, data-referral and data-load are passed on to the chosen date’s seat map.
• A buyer back from the gateway lands on the date they were paying for.
• If the run can’t be read, whatever you put inside the tag stays, so a plain link to the run’s page is a good fallback.

The run’s code is a small separate file the widget fetches only when a page has a run tag, so pages without one load nothing extra.

A short pass

For two or three dates sold together, the same seat on each, made as a Performance Group:

<div data-seatlayer-performance-group="GROUP_KEY" data-return-url="page"></div>

The pass’s seat map opens inline with SeatLayer checkout. A pass that isn’t on sale, or that you sell elsewhere, says so in one line.

Seasons

New seasons sell on their own page, app.seatlayer.io/s/SEASON_KEY, or through the SDK. A data-seatlayer-season tag already on your page keeps working.