---
title: "What's on, with no code"
description: "Paste one tag and one script into any page to sell a single date, a run of dates, or a short pass, with SeatLayer checkout and the buyer staying on your site."
---

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:

```html
<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

```html
<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](/server-api/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:

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

<Aside type="caution" title="Make the dates public in the dashboard first">
  A run's dates must be made public from the dashboard. Open the date, go to
  **Sell & share**, and turn on **Show this event on my website**. There is no
  API for this step, so a run made only with a secret key lists nothing. Do it
  on the first date before you make the run and each copy starts public; a date
  already made is changed on its own. A date must also sell through SeatLayer
  checkout: a series made from a `chartKey` with a key sells through your own
  checkout and can't be public, so make the run
  [from an event that uses SeatLayer checkout](/server-api/event-series/#from-an-event-you-already-set-up).
</Aside>

- 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](/buyer-sdk/performance-groups/):

```html
<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](/buyer-sdk/seasons/). A `data-seatlayer-season` tag already on your
page keeps working.