Using Embedded Checkout to sell tickets on your website

Sell tickets right from your website or blog with our website integration. Attendees complete the purchase without leaving your website. If you can’t checkout after adding the code, review the troubleshooting steps below. Go to your event dashboard and select “Embedded Checkout” (under “Marketing”) to get started.

In this article

Using Embedded Checkout
If Eventbrite's embedded checkout doesn't work

Using Embedded Checkout

1. Go to "Embedded Checkout".

Go to “Manage events” in your account. Then select your event.
Go to “Embedded Checkout” (under “Marketing”).

2. Choose how checkout appears.

You can choose between two options:

Button: opens a window on top of your website to reveal available tickets. To preview, click “Buy Tickets”.
Embedded: available tickets are automatically shown on the page. To preview, choose your ticket quantity and click “Checkout”.

Your ticket types need to be on sale for the preview to work. If you complete the checkout process, Eventbrite will treat it as a real registration.

3. Copy the embed code and paste it into your website.

You must have an HTTPS certificate for attendees to complete their registration on your website.

Click “Copy code.”
Paste it into your website.

View and test the embedded checkout on your website to confirm it’s working. If you need help with this step, we recommend contacting your web developer. Eventbrite can't assist with pasting the code on your website.

If Eventbrite's embedded checkout doesn't work

1. “Website Integrations” is greyed out on the Event Dashboard.

Some features are unavailable while your event is a draft. You have to publish your event before you can access Website Integrations.

2. The checkout redirects to your Eventbrite event listing.

If your event no longer qualifies for embedded checkout, attendees are sent to your Eventbrite event listing to complete registration. Your event may no longer qualify because:

You don’t have an HTTPS certificate on your website. Learn more about setting up HTTPS for your website.

3. Wordpress added HTML formatting code to the Eventbrite embed code.

Gutenberg editor is enabled by default in new versions of Wordpress and is not compatible with the Raw HTML plugin. If you notice an issue with how embedded checkout functions or experience rendering issues, try disabling Gutenberg editor.

Go back to the "Text" editor for your page in Wordpress.
Check for any added HTML formatting code (e.g., code for paragraphs and line breaks)
Install the "Disable Gutenberg editor" plugin.
Go to Settings and choose General. Then, make sure “WordPress should correct invalidly nested XHTML automatically” is not selected/enabled.

4. You can’t scroll in embedded checkout.

If you’re trying to add multiple embeds on the same page, your attendees won’t be able to scroll unless you change the embed code.

FIRST BUTTON EMBED

1. Give the <button id> parameter a unique value for each embed. For example, for the first embed on your website, change:

<button id="eventbrite-widget-modal-trigger-43896296003" type="button">Buy Tickets</button>

<button id="number1-43896296003" type="button">Buy Tickets</button>

2. Then, within the same code snippet, change the modalTriggerElementId to match:

modalTriggerElementId: 'eventbrite-widget-modal-trigger-43896296003'

modalTriggerElementId: 'number1-43896296003'

SECOND BUTTON EMBED

1. Make sure the second "button id" has a different, distinct value. The value needs to match the modalTriggerElementId. For example, change: