Embedding the checkout

Updated 25 Sep 2026

Put your booking checkout on your own website — inline, as a popup, or as a standalone page you can link to from anywhere.

Everything on this page lives under Checkout in the dashboard, where the snippets are pre-filled with your venue's ID. The examples below use your-venue as a stand-in.

Inline, in the page

Paste this where you want the checkout to appear:

<div id="lu-checkout" data-venue="your-venue"></div>
<script src="https://checkout.getlupo.app/embed.js" defer></script>

As a popup from a "Book now" button

The checkout opens over your page when the button is clicked. Style the button however you like.

<button data-lu-open="your-venue">Book now</button>
<script src="https://checkout.getlupo.app/embed.js" defer></script>

Gift cards on their own

A standalone gift-card purchase box, for a "Gifts" page:

<div id="lu-giftcard-buy" data-venue="your-venue"></div>
<script src="https://checkout.getlupo.app/embed.js" defer></script>

A standalone booking page

The same checkout also works as its own page — useful for socials, a QR code on a table, or a "Book now" link in an email. The link is shown under Standalone checkout page on the Checkout page.

You can add a slim banner to the top of the standalone page with a back-link to your website — tick Show a slim banner, then add the link text and URL.

Check it's working

The Live checkout preview on the Checkout page loads the real checkout, not a mockup — switch between desktop and mobile to check both. If your products don't appear, see Why isn't my product showing?