Registrierung auf Ihrer Website einbetten

Overview

The embed widget lets you add a CompleteEvent registration form directly to your own website — no redirects, no leaving your domain. Visitors register without ever seeing the CompleteEvent URL. Available on Starter and Pro plans.

Getting Your Embed Code

1. Open your event in the dashboard and go to Promote → Embed.
2. You'll see two embed options: a script snippet and an iframe snippet. Copy either one.
3. Paste it into your website's HTML wherever you want the registration form to appear.

Script Snippet (Recommended)

The script snippet injects a responsive iframe that auto-sizes to the form content:

<div id="ce-widget"></div>
<script src="https://completeevent.app/embed.js"
  data-event="your-org/your-event"></script>

The widget automatically resizes as the form progresses (selecting a tier, filling details, confirming payment). It requires no additional JavaScript from you.

iframe Snippet

If your website restricts inline scripts, use the plain iframe version instead:

<iframe
  src="https://completeevent.app/embed/your-org/your-event"
  width="100%"
  height="600"
  frameborder="0">
</iframe>

Set height to a value that fits your layout. The embed page is designed to work at any width above 320px.

Return URL

By default, after a successful registration the embed shows a confirmation screen inside the widget. If you'd prefer to redirect attendees to a custom page on your own site (a thank-you page, for example), set a Return URL in the Embed settings:

1. In the Embed dashboard page, scroll to Return URL.
2. Enter the full URL of your thank-you page.
3. Save. The widget will redirect there after a successful registration.

Detecting a Completed Registration

If you want to run JavaScript on your page after a registration completes (to fire a conversion pixel, for example), listen for the ce-registered postMessage event:

window.addEventListener("message", (e) => {
  if (e.data?.type === "ce-registered") {
    const { code } = e.data; // attendee's confirmation code
    // fire your analytics event, etc.
  }
});

Styling the Widget

The embed uses your event's brand color for buttons and accents. It does not inherit CSS from the host page. To adjust the height or add a border, style the container div or iframe element directly in your site's CSS.

Preview

The Embed dashboard page shows a live preview iframe so you can see exactly how the form will look before you copy the snippet.