# Ticketlayer > Ticketlayer is a ticketing platform. Sell tickets on any website with one script tag or an npm package (the Live SDK and Elements), manage events, orders and customers through the Backstage API, and receive webhooks when orders and tickets change. API version: 2026-06-13 (dated version, sent as the TL-Version header; additive changes never change it). Generated 2026-09-14 from https://docs.ticketlayer.com. Key facts: - Browser code uses a publishable key (tlpk_...) from a sales channel; it is safe to expose. Server code uses an organisation API key (tlak_...); never ship it to a browser. - The CDN loader (https://cdn.ticketlayer.com/v1/ticketlayer.js) boots from data-* attributes and registers the tl-* web components; today data-api-url and data-checkout-base must be set explicitly (see the HTML quickstart). - Elements bind to window.Ticketlayer, which createLiveClient() publishes. Element tag names, attribute names and tl* event names are part of the contract. - Card details never touch your page: checkout runs in the hosted checkout (an iframe modal on embeds). - Only @ticketlayer/backstage is on npm today; @ticketlayer/live, @ticketlayer/elements and @ticketlayer/elements-react publish once their release workflows run. Use the CDN build until then. ## Build: sell tickets on your site - [Sell tickets on your website](https://docs.ticketlayer.com/guides/getting-started/welcome): One script tag or one npm install puts an event list, a buy button and a hosted checkout on any site. Here is the snippet, the packages, and where the key comes from. - [HTML quickstart](https://docs.ticketlayer.com/guides/quickstarts/html): A single HTML file that lists events, sells tickets through the hosted checkout and shows the order. No build step. - [Next.js quickstart](https://docs.ticketlayer.com/guides/quickstarts/nextjs): Server components read the catalogue through @ticketlayer/live/server; a client provider boots the browser SDK and Elements for the buy flow. - [Vite + React quickstart](https://docs.ticketlayer.com/guides/quickstarts/vite-react): A client-only React app (what Lovable and Bolt generate) with the Live SDK, React Elements wrappers and the hosted checkout modal. ## Integrate: keys, webhooks, agents - [Keys and authentication](https://docs.ticketlayer.com/guides/getting-started/authentication): Publishable keys for the browser, organisation API keys for your server, Stagedoor OAuth for staff apps: which credential goes where, and the headers each one uses. - [Webhooks](https://docs.ticketlayer.com/guides/integrations/webhooks): Signed POSTs when orders, customers, events and tickets change: the eight event types, their payloads, the envelope, signature verification and retries. - [Connect an AI agent (MCP)](https://docs.ticketlayer.com/guides/agents/mcp): Point Claude Code, Claude Desktop, Cursor or any MCP client at Ticketlayer's remote MCP server to read your catalogue, orders and analytics and create events, as you. - [Sell tickets on your website](https://docs.ticketlayer.com/scenarios/sell-tickets-on-website): From a sales channel and a publishable key to an event list, a buy button, the hosted checkout and a confirmation on your page and your server. - [SDKs](https://docs.ticketlayer.com/reference/sdk): The two TypeScript SDKs: @ticketlayer/backstage for servers and staff tools, @ticketlayer/live for browsers and apps that sell tickets. Which are on npm today. - [API versions](https://docs.ticketlayer.com/api/backstage/versions) ## Elements reference - [Elements](https://docs.ticketlayer.com/reference/elements): The Ticketlayer Elements: web components that list events, sell tickets and show orders on any page, plus the theme tokens they read. - [](https://docs.ticketlayer.com/reference/elements/tl-buy-modal): The tl-buy-modal element. - [](https://docs.ticketlayer.com/reference/elements/tl-buy-tickets-button): The tl-buy-tickets-button element. - [](https://docs.ticketlayer.com/reference/elements/tl-buy-tickets-wrapper): The tl-buy-tickets-wrapper element. - [](https://docs.ticketlayer.com/reference/elements/tl-cart-badge): The tl-cart-badge element. - [](https://docs.ticketlayer.com/reference/elements/tl-cart-drawer): The tl-cart-drawer element. - [](https://docs.ticketlayer.com/reference/elements/tl-cart): The tl-cart element. - [](https://docs.ticketlayer.com/reference/elements/tl-checkout-wrapper): The tl-checkout-wrapper element. - [](https://docs.ticketlayer.com/reference/elements/tl-event-card): The tl-event-card element. - [](https://docs.ticketlayer.com/reference/elements/tl-event-list): The tl-event-list element. - [](https://docs.ticketlayer.com/reference/elements/tl-login): tl-login - magic-link sign-in. - [](https://docs.ticketlayer.com/reference/elements/tl-my-orders): tl-my-orders - the signed-in customer's orders (GET /sales/my-orders through the SDK): event, date, ticket count, total and status per row. - [](https://docs.ticketlayer.com/reference/elements/tl-occurrence-selector): A smart occurrence selector component that fetches and displays event occurrences from the Ticketlayer API. - [](https://docs.ticketlayer.com/reference/elements/tl-order-confirmation): tl-order-confirmation - the \"thank you\" page block: order reference, customer email, event and date, ticket lines, totals, then the tickets themselves (tl-order-tickets, each with a Download PDF link) - [](https://docs.ticketlayer.com/reference/elements/tl-order-tickets): tl-order-tickets - renders all the tickets for an order as scannable QR cards with PDF download. - [](https://docs.ticketlayer.com/reference/elements/tl-promo-code): tl-promo-code - an input plus Apply button that redeems a presale or promo code for the current cart (POST /sales/presale-codes/redeem through the SDK). - [](https://docs.ticketlayer.com/reference/elements/tl-seat-map): The tl-seat-map element. - [](https://docs.ticketlayer.com/reference/elements/tl-ticket-selector): The tl-ticket-selector element. - [](https://docs.ticketlayer.com/reference/elements/tl-ticket): tl-ticket - a single event ticket: a scannable QR (the redemption token), ticket name / seat / holder, and a PDF download. ## API reference - [Backstage API](https://docs.ticketlayer.com/api/backstage/): management API - events, venues, inventory, sales channels, orders, customers, payments, webhooks. OpenAPI: https://docs.ticketlayer.com/openapi/backstage.json - [Live API](https://docs.ticketlayer.com/api/live/): the buyer-facing commerce API used by the Live SDK and Elements - sessions, listings, carts, checkout, customer sign-in, my orders. OpenAPI: https://docs.ticketlayer.com/openapi/live.json - [Backstage SDK reference](https://docs.ticketlayer.com/reference/sdk/backstage): @ticketlayer/backstage, generated from the Backstage OpenAPI document - [Live SDK reference](https://docs.ticketlayer.com/reference/sdk/live): @ticketlayer/live, generated from the Live OpenAPI document ## Optional - [Full text](https://docs.ticketlayer.com/llms-full.txt): every page above plus an operation index of both APIs in one file - [Scenarios](https://docs.ticketlayer.com/scenarios): end-to-end walkthroughs