Submit a ticket My Tickets
Welcome
Login  Sign up
Open navigation

How to Integrate Eventbrite with your LearnWorlds School

Eventbrite is a ticketing and event technology platform that helps businesses organize and sell tickets to events online while helping people discover events that fuel their passions. You can utilize it to create, manage, promote, and sell your events, workshops, concerts, conferences, and festivals.

Create an Event

To create an Event on Eventbrite follow the step-by-step instructions below. Please note that you need a Professional or Premium account on Eventbrite.

1. Visit the official website of  Eventbrite, log in to your Eventbrite account, and select Create Event.

2. Fill in the basic info, choose a location, select the date, and time of the event.

3. You will be asked to manage your event's details by writing a Description, adding text, images, and video, and click on the Save & Continue button.

4. Navigate to the Tickets option, click Create Ticket, enter your ticket information, and make sure you select an option e.g. Free, Paid, or Donation, and click on Save.

5. You are ready to Publish your event! Great job :) For further information, refer to the relevant article on Eventbrite.

Embed Eventbrite to LearnWorlds

Let's explore how you can embed Eventbrite to LearnWorlds Pages and Learning Units, as well. Once you create an event, click on Website Integrations.

Old interface: 

Here you will find two types of integrations, Simple and Advanced:

In simple integration, we have:

  • Event Calendar

  • Countdown, and 

  • Text Link


In Advanced (checkout) integration, we have two flavors: 

  • A button that opens the checkout modal over your content
  • Embedded on the page with your content

Simple integration on LearnWorlds

Eventbrite has an editor to configure widgets and produces HTML code. Feel free to alter the HTML code to fit your needs.

Event Calendar

You can use a similar code as below, to insert a calendar widget and embed it to a page or an embed learning unit.

<div style="width:195px; text-align:center;" ><iframe  src="https://www.eventbrite.com/calendar-widget?eid=101283469584" frameborder="0" height="377" width="195" marginheight="0" marginwidth="0" scrolling="no" allowtransparency="true"></iframe><div style="font-family:Helvetica, Arial; font-size:12px; padding:10px 0 5px; margin:2px; width:195px; text-align:center;" ><a class="powered-by-eb" style="color: #ADB0B6; text-decoration: none;" target="_blank" href="http://www.eventbrite.com/">Powered by Eventbrite</a></div></div>

Countdown

You may use a similar code to add the calendar widget to embed it to a page or an embed learning unit

<div style="width:195px; text-align:center;" ><iframe  src="https://www.eventbrite.com/countdown-widget?eid=101283469584" frameborder="0" height="277" width="195" marginheight="0" marginwidth="0" scrolling="no" allowtransparency="true"></iframe><div style="font-family:Helvetica, Arial; font-size:12px; padding:10px 0 5px; margin:2px; width:195px; text-align:center;" ><a class="powered-by-eb" style="color: #ADB0B6; text-decoration: none;" target="_blank" href="http://www.eventbrite.com/">Powered by Eventbrite</a></div></div>
<a href="https://www.eventbrite.com/e/corona-test-party-at-home-tickets-101283469584?ref=elink" target="_blank" style="color:#45494E">Text for link</a>

Advanced (checkout) integration on LearnWorlds

Α JavaScript library is used on Advanced integration, which needs to be loaded in the first place. You would need to modify the integration code produced from Eventbrite, in order to work on our system.

A button that opens the checkout modal over your content

Below you will find the snippet code of Eventbrite.

<!-- Noscript content for added SEO -->
<noscript>
    <a href="https://www.eventbrite.com/e/corona-test-party-at-home-tickets-101283469584" rel="noopener noreferrer"
        target="_blank">
</noscript>
<!-- You can customize this button any way you like -->
<button id="eventbrite-widget-modal-trigger-101283469584" type="button">Buy JavaScript Tickets</button>
<noscript></a>Buy Tickets on Eventbrite</noscript>
<script type="text/javascript">   
    var s = document.createElement('script'); 
    s.src = "https://www.eventbrite.com/static/widgets/eb_widgets.js"; 
    s.onload = function () { var exampleCallback = function () { console.log('Order complete!'); }; 
    window.EBWidgets.createWidget({ widgetType: 'checkout', eventId: '101283469584', modal: true, modalTriggerElementId: 'eventbrite-widget-modal-trigger-101283469584', onOrderComplete: exampleCallback }); }   
    document.body.appendChild(s);
</script>

It should be as below, in order to work on our system (on pages and embed learning unit). You need to replace the eventId and the modalTriggerElementId.

<!-- Noscript content for added SEO -->
<noscript><a href="https://www.eventbrite.com/e/corona-test-party-at-home-tickets-101283469584" rel="noopener noreferrer" target="_blank"></noscript>
<!-- You can customize this button any way you like -->
<button id="eventbrite-widget-modal-trigger-101283469584" type="button">Buy

Tickets</button>
<noscript></a>Buy Tickets on Eventbrite</noscript>


<script type="text/javascript">
   var s = document.createElement('script');
   s.src = "https://www.eventbrite.com/static/widgets/eb_widgets.js";
   s.onload = function () {
    var exampleCallback = function() {
        console.log('Order complete!');
    };

    window.EBWidgets.createWidget({
        widgetType: 'checkout',
        eventId: '101283469584',
        modal: true,
        modalTriggerElementId: 'eventbrite-widget-modal-trigger-101283469584',
        onOrderComplete: exampleCallback
    });
   }
   document.body.appendChild(s);
</script>

This snippet code is inserted into an embed learning unit.

Embedded on the page with your content

Here you will find the snippet code of Eventbrite.

<div id="eventbrite-widget-container-101283469584"></div>
<script src="https://www.eventbrite.com/static/widgets/eb_widgets.js"></script>
<script type="text/javascript">
 var exampleCallback = function() {
console.log('Order complete!');
};

window.EBWidgets.createWidget({
// Required
widgetType: 'checkout',
eventId: '101283469584',
iframeContainerId: 'eventbrite-widget-container-101283469584',

// Optional
iframeContainerHeight: 425, // Widget height in pixels. Defaults to a minimum of 425px if not provided
onOrderComplete: exampleCallback // Method called when an order has successfully completed
});
</script>

Specifically, you only need to copy the eventId and the iframeContainerId.

<div id="eventbrite-widget-container-101283469584"></div>
<script type="text/javascript">
var s = document.createElement('script');
s.src = "https://www.eventbrite.com/static/widgets/eb_widgets.js";
s.onload = function () {
var exampleCallback = function() {
console.log('Order complete!');
};
window.EBWidgets.createWidget({
// Required
widgetType: 'checkout',
eventId: '101283469584',
iframeContainerId: 'eventbrite-widget-container-101283469584',
// Optional
iframeContainerHeight: 425, // Widget height in pixels. Defaults to a minimum of 425px if not provided
onOrderComplete: exampleCallback // Method called when an order has successfully completed
});
}
 document.body.appendChild(s);
</script>

This is the final result!

That’s it! You have just embedded Eventbrite into your LearnWorlds school. 


Did you find it helpful? Yes No

Send feedback
Sorry we couldn't be helpful. Help us improve this article with your feedback.