Ticket Selector Embed Code

The “Ticket Selector Embed Code” is simple, right? Just click the “Embed” button in the event editor, after creating an event. The code that appears in the modal window can then be copied and pasted into any web page. However, there is a little more involved than that, including how to add a ticket selector to a Facebook page.

Step 1

Click the “Embed” code button in the ticket editor. embed-button-example

Step 2

Copy the embed code from the modal popup window.
embed-code-example

Step 3

Paste the code in any HTML web page, blog post or page (by WordPress.com, WordPress.org, Drupal, Blogger, etc). i-frame-example

Step 4

That’s it! Start sharing your embed code with other website and/or blog owners to start getting your events noticed.

Adding an EE4 Ticket Selector to Facebook

This is quick and easy using Event Espresso 4. If you have already created your event, follow the instructions below.

We use the Static HTML: iframe tabs Facebook application to embed the EE4 ticket selector into a Facebook page. You’ll learn how to add this application soon, but let’s first get our EE4 ticket selector iframe embed code for Facebook.

Getting your ticket selector  embed code

Step 1

Click the “ Embed” tab from within the EE4 event editor.
embed-button-example

Step 2

Select and copy the iframe code from the modal popup window.
embed-code-example

Adding Iframe App to your Facebook Page


Please Note!
When developing an iFrame application FB needs to be able to access the content securely via SSL.

This means using https:// and that will require that you have an SSL certificate installed on the site you are retrieving the embed code from.

If your content can’t be accessed securely then FB users will get an error message and the ticket selector will not be displayed on Facebook.


Step 1

Go to your Facebook page and on the search bar enter “Static HTML: iframe tabs” or visit this link https://apps.facebook.com/static_html_plus.
facebook-static-html-button

Step 2

Click the “ Add Static HTML to a Page” button.

Step 3

Choose your Facebook page to add the iframe tab and click the add button.
facebook-add-page-tab

Adding the Ticket Selector to your Facebook page

Step 1

Go to your Facebook page and find the Custom iframe app you just installed. It is usually found under  More options named “Welcome” tab as seen on the screenshot below. See FAQ section below if you want to change the default page tab name.
facebook-manage-tabs

Step 2

Click “ Edit Tab” to add content to the Page Tab.
facebook-edit-tab

Step 3

There are two options you can choose to display your form on your Facebook page. The first one Content (Public Content) makes it available to everyone, while the second one Leadgate (Fan Content) makes it available only to your Facebook fans, or  users who liked your Facebook page. Make sure to publish your page afterwards. Check the following screenshot.

facebook-paste-embed-code

Frequently Asked Questions (FAQ)

  • The page tab does not appear on mobile devices?
    Page tab apps are not supported on mobile devices by Facebook’s Platform. However, Static Iframe Tab App provides direct URL to your page tab that is viewable on mobile devices. To get your page direct URL, simply edit your Facebook tab, click on the “Enable tab on mobile devices” button, and copy the link you see on the Tab URL box.
  • facebook-paste-embed-code-mobile-device
  • How to change the page tab name and tab image?
    These can be changed on the tab settings. Go to your tab settings and look for the “Tab name and picture” tab.
    facebook-paste-embed-code-tab-name
  • No ticket selector displayed in the Facebook page?
    Please make sure you have an SSL certificate installed on the site you are retrieving the embed code from.

If you are stuck with any of the steps above or if you have further questions about this guide, feel free to post it on the comments section below.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us