Eventbrite

Help Center

Organizing an event

How to add Eventbrite’s Embedded Checkout to your WordPress.org site

With our new embedded checkout, people buy tickets without ever leaving your website — connecting attendees to your brand and making registration seamless. First generate your embed code on Eventbrite. Then follow this step-by-step guide to set up embedded checkout on WordPress.org. Be sure to preview and and test your WordPress.org page and embedded checkout before you publish.

In this article

  • 1. Generate your embed code.
  • 2. Go to your WordPress.org account.
  • 3. Go to “Plugins” and select “Add New”.
  • 4. Search for “Raw HTML”.
  • 5. Click “Install Now,” then “Activate”.
  • 6. Edit your WordPress.org page.
  • 7. Click “Text”.
  • 8. Click “Preview changes”.
  • 9. Decide where to add embedded checkout.
  • 10. Find your keyword on the Edit Page.
  • 11. Copy-paste the embed code.
  • 12. Add “[raw]” before and “[/raw]” after your embed code.
  • 13. Preview your WordPress.org page.
  • 14. Click “Update”.
  • 15. Test your embedded checkout.

TIP: To use our new embedded checkout, your website needs an HTTPS certificate. Learn more.

NOTE: Some Eventbrite features will disqualify your event from using the new embedded checkout. Read our troubleshooting article to learn more.

1. Generate your embed code.

To get the embed code you'll add to your website, follow our step-by-step instructions.

TIP: Leave the browser window with your Eventbrite embed code open. You’ll have to copy the code in Step 11.

2. Go to your WordPress.org account.

Open the website or app from which you manage your WordPress.org site.

3. Go to “Plugins” and select “Add New”.

In your WordPress.org environment, hover over “Plugins” in the sidebar and click “Add New”.

4. Search for “Raw HTML”.

Under Add Plugins, click the search bar and enter “Raw HTML”. Hit the enter / return key on your keyboard to search.

5. Click “Install Now,” then “Activate”.

Under Raw HTML, click “Install Now”. Once you've installed Raw HTML, click “Activate”.

6. Edit your WordPress.org page.

Select “Pages” from the sidebar. From the Pages menu, click the page that should include embedded checkout.

NOTE: If you’d like to add our embedded checkout to a specific blog post, go to “Posts” instead of “Pages”. From the Posts menu, click on the post that will include the embedded checkout.

7. Click “Text”.

On the Edit Page, click on “Text”. You’ll notice the text editor now includes the HTML code for your page.

8. Click “Preview changes”.

Click “Preview changes” to see a preview of your WordPress.org page.

NOTE: Click “Preview changes” to see a preview of your WordPress.org page.

9. Decide where to add embedded checkout.

Pick the paragraph after which you want to insert embedded checkout. Highlight and copy the last word of the paragraph.

EXAMPLE: John is adding embedded checkout below the paragraph ending with “rain”.

10. Find your keyword on the Edit Page.

Go back to the Edit Page and find your keyword.

TIP: To open a search bar from where you can quickly search, hit “Ctrl + F” on a PC and “cmd + F” on a Mac. Learn more.

11. Copy-paste the embed code.

Return to Eventbrite’s embedded checkout page and copy the embed code. Go back to WordPress.org and paste the embed code after the end tag of the paragraph with your keyword.

TIP: You can usually recognize an end tag (also known as closing tag) by the “/” within the tag. Learn more.

12. Add “[raw]” before and “[/raw]” after your embed code.

Type “[raw]” before the embed code and “[/raw]” after the embed code. This will keep WordPress.org from automatically formatting the code.

13. Preview your WordPress.org page.

Click “Preview Changes” to see how your embedded checkout will appear for potential attendees. If it’s in the wrong place, return to the Edit Page and move the embed code.

TIP: If you’ve never published this WordPress.org page, you’ll see “Preview” instead of “Preview Changes”.

NOTE: The button and ticket listing versions of embedded checkout have a different appearance.

14. Click “Update”.

Once you’re happy with how your new embedded checkout looks, click “Update”.

TIP: If you’ve never published this WordPress.org page, you’ll see “Publish” instead of “Update”.

15. Test your embedded checkout.

Test your website, to be sure that people can buy tickets — no matter their browser, device, or screen size. Learn more.

NOTE: If you notice an issue with how embedded checkout functions or experience rendering issues, disable Gutenberg editor.

Still have questions?