Embedding Lists

Add Nuncio event lists to any website with a simple script tag.

Basic Usage

Add a container element with your list slug, then include the widget script:

<div data-nuncio-list="your-list-slug"></div>
<script src="https://nuncio.app/widget.js"></script>

Replace your-list-slug with your actual list slug, found in your list's URL.

Multiple Lists

You can embed multiple lists on the same page:

<div data-nuncio-list="summer-tour-2025"></div>
<div data-nuncio-list="festival-lineup"></div>
<script src="https://nuncio.app/widget.js"></script>

Only include the script once, even with multiple lists.

Custom API URL

If you're using a custom domain or development server, specify the API base URL:

<div data-nuncio-list="your-list-slug"></div>
<script
  src="https://nuncio.app/widget.js"
  data-api="https://your-domain.com"
></script>

Styling

The widget uses semantic HTML with .nuncio-* CSS classes. You can customize the appearance with your own styles:

.nuncio-list {
  /* List container */
}

.nuncio-list-title {
  /* List title */
}

.nuncio-events {
  /* Events list (ul element) */
}

.nuncio-event {
  /* Individual event (li element) */
}

.nuncio-event-title {
  /* Event title */
}

.nuncio-event-date {
  /* Event date */
}

.nuncio-event-location {
  /* Venue/location */
}

.nuncio-event-tickets {
  /* Ticket link */
}

View Tracking

The widget automatically tracks views when events are displayed. This data is available on your list's analytics page.

Requirements

• The list must be Public or Unlisted (not Private)
• JavaScript must be enabled in the browser
• The widget makes requests to the Nuncio API