Skip to content

Embedding on your site

Platypus pages are built to live inside your own website. Three surfaces embed with a plain <iframe> — no JavaScript snippet, no API key:

SurfaceURLWhat it shows
Event details card/t/{slug}/events/{event-slug}/embed/detailsDate, time, and location — the "Dates & venues" card for multi-date events
Tickets card/t/{slug}/events/{event-slug}/embed/ticketsTicket types with prices (or Free / Sold out) and the Buy tickets button; the "Dates & venues" card with per-date buy buttons for multi-date events; cancellation notice for cancelled events
Events listing/t/{slug}/eventsYour full public events page (grid/list)

The two card embeds carry no Platypus chrome (header, navigation, or footer); the events listing embeds as the full page, navigation and footer included. All three render with your venue's Platypus stylesheet.

Site Domain — the one prerequisite

Platypus refuses to be framed by arbitrary websites. Every public page sends a Content-Security-Policy: frame-ancestors header that allows exactly two origins: Platypus itself, and your configured Site Domain. A venue admin sets it under Settings → General → Site Domain as a bare hostname such as www.exampletheatre.com.au; Platypus allows that host as an https:// origin.

If the iframe renders blank and the browser console reports a frame-ancestors violation, the Site Domain is unset or doesn't match the domain the page actually lives on. Fix the setting; no code change is needed.

Admin and login pages can never be framed by your site — or anyone else's.

Example

html
<iframe
  src="https://platypus.tickets/t/nbt/events/an-evening-of-one-act-plays-2030-03-14/embed/tickets"
  title="Tickets — An Evening of One-Act Plays"
  style="width: 100%; max-width: 480px; border: 0"
  height="520"
></iframe>

The event slug is the slug attribute from the API; it also appears in the event page's URL. Pick a height that fits the content, because the cards don't auto-resize the frame.

Buying tickets inside the frame

The tickets card's Buy tickets button navigates the iframe itself to checkout, and checkout is designed to complete in-frame, card entry included. Buyers never need to leave your page. Paid tickets need your venue's Stripe keys configured — until then only free ticket types show the buy button, and a free checkout completes without a card step.

Theming

There are no per-embed style parameters. Embeds follow your venue's global appearance settings (public site theme and custom CSS, configured in the Platypus admin), so they match your Platypus pages everywhere they're shown. The selector contract for styling embedded pages is documented in Appearance & custom CSS.

Prefer data over iframes?

If you want full control of the markup, fetch the same event data as JSON from the public API and render it yourself. The CORS allowance uses the same Site Domain setting.

Platypus.Tickets reference documentation. Contact & support.