Eventrise Checkout — Embed Demo

The page renders /checkout/creative-south-2027 in two embedding contexts so partners (WordPress plugin, organizer microsite) can pick the integration that fits their flow.

1. Inline iframe

Drop the snippet into any HTML page. Cookies and storage live on the iframe origin (1st-party), so guest checkout, Stripe, and seats.io all work without 3rd-party-cookie issues.

Copy this snippet

html

<iframe
  src="https://checkout.dev.eventrise.com/checkout/creative-south-2027"
  width="100%"
  height="900"
  allow="payment"
  sandbox="allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox"
  referrerpolicy="strict-origin-when-cross-origin"
  title="Eventrise Checkout"
  style="border: 0;"
  loading="lazy">
</iframe>

2. Modal iframe

A button opens an Eventrise-styled dialog containing the iframe. Closing the dialog unmounts the iframe so checkout state resets.

Copy this snippet (vanilla HTML/JS)

html

<button id="er-checkout-trigger" type="button">Buy Tickets</button>

<dialog
  id="er-checkout-dialog"
  style="border:0; padding:0; width:90vw; max-width:1200px; height:90vh; max-height:900px; background:#fff; border-radius:16px;">
  <iframe
    id="er-checkout-iframe"
    src="about:blank"
    width="100%"
    height="100%"
    allow="payment"
    sandbox="allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox"
    referrerpolicy="strict-origin-when-cross-origin"
    title="Eventrise Checkout"
    style="border:0; display:block;"></iframe>
</dialog>

<script>
  (function () {
    var trigger = document.getElementById('er-checkout-trigger');
    var dialog  = document.getElementById('er-checkout-dialog');
    var iframe  = document.getElementById('er-checkout-iframe');
    var src     = 'https://checkout.dev.eventrise.com/checkout/creative-south-2027';
    trigger.addEventListener('click', function () {
      iframe.src = src;
      dialog.showModal();
    });
    dialog.addEventListener('close', function () {
      iframe.src = 'about:blank';
    });
  })();
</script>