Embed ticket sales in your website
Once you have set up your event, you might want to integrate your ticket sales in your website. This means that your website visitors will be able to see which events you currently have on sale, and they will be able to click through to the events in TicketCo and purchase tickets.
You can use an iFrame to integrate your sales in your website, which can be a great marketing tool. The iFrame builder and customiser tool is located under Promote in the main menu, and also in your individual events.
You will customise what information you want your iFrame to display, and in which format, and then the tool will create a code which you can give to your web designers. Your web designers can embed the code in your website, and there you have it - event information and ticket sales all integrated in your page!
NEW! Click here to skip ahead to see the latest updates to the iFrames module.
Customising your iFrame
Click through to your desired event via Events in the main menu. Then navigate to the Promote tab. You will see two options on the left hand side, Tracking Links and iFrames (embedding); click on the latter, and you should see a screen like this:
If you want to create an iFrame which will show all of your events, you would select iframe code for your events (1). You can customise the width and height of your iFrame (2). This is preset to 800px in height, and a max width of 100%. If you are unsure what size your iFrame should be, we suggest maintaining these settings and seeing how it fits in your web page, as you can always adjust these settings and generate a new code afterwards. Your web designer should also be able to assist you with this.
You can toggle between showing only upcoming events, only ended events, or all events (3). The Date filter will also help you select which events to display, and you can choose whether you want to display them in ascending or descending order by clicking on Sorting.
Note that when creating an iFrame for multiple events, only published non-hidden events will be displayed. Events that are hidden by using the "Make this event private" checkbox under Event Details will not be displayed.
Under Track your marketing and sales (5) you can connect any tracking links you have set up with your iFrame. Simply select the relevant link in the drop down menu. This allows you to monitor hits and sales coming from your iFrame to your TicketCo page. This may be useful if you are working with a partner company who have your iFrame embedded in their site. If you do not have any tracking links set up, you can leave this field as "Not selected".
Tags (6) allows you to filter certain events according to the tags they have registered under Event Details. If you have lots of different events, but you want to create an iFrame showing only e.g. your minigolf events, then you could add the tag "minigolf" onto the relevant events, and then type it in here; meaning only events tagged with "minigolf" will be displayed in the iFrame.
Next, you can activate which information you wish to be included in your iFrame (7).
Copy to clipboard
Use the Preview section at the bottom of the screen see how your iFrame is looking.
Your iFrame code will be displayed under Your Code and it will update automatically when you make adjustments. Click the Copy to clipboard (8) button to copy the code, which you can then embed in your web page or send onto your web designers.
Individual events and calendar view
If you just want to embed a particular event in your site, make sure to select iframe code for this event (9). This will allow you to generate an iFrame code for your specific event, which will be displayed even if it is marked as private under Event details (as opposed to an iFrame containing multiple events).
Selecting iframe code for your calendar (10) works in a similar way, although the events are displayed in a calendar format instead of a list:
Promote in the main menu works very similarly to Promote under the individual events. The tab in the main menu looks like this:
Just as before, you can toggle between a list view or a calendar view under Widget Type, you can choose what information to display, filter by tags etc. Note that if you want to generate an iFrame code for just one specific event, then you must go Promote on the relevant event page instead.
If you have embedded your iFrame, and then want to edit something, you will need to edit your iFrame settings and the copy across the new regenerated code.
We hope that this article has helped you with embedding and integrating your sales on your webpage. This can be a great way of advertising your upcoming events and encouraging more sales!
Updates in 2022
There are now a couple of other customisation options added to the iFrames module:
These appear under the List Features section.
This adds a Call to action button to the iFrame so that your end users can easily click to open the event page in question if there are tickets left available. Sold out events will not contain a button. Your end users can always select the hyperlinked event name to open the page; however, including Call to action buttons can make the purchase journey even clearer for some customers.
Open in New Tab
You can select whether event links should open in a new tab as opposed to opening within your iFrame window. As standard, the event page in question will open within your iFrame, and only once the customers select Purchase, will they be redirected to TicketCo. If you choose to Open in new tab, then the event page will open in a separate tab rather than within your iFrame, meaning your end users will still have your webpage open.
You can now add UTM tags to iFrames for better tracking and analytics. Simply select the Utm campaign information checkbox under the Promote module and input your campaign source, medium and name before copying and pasting the iFrame code.
Please note that we recommend that you do not use spaces in a UTM tag. If you do, these will automatically convert into symbols like % and will be hard to read. Instead, use a dash between your words, such as campaign=pre-sale-early-bird. Also note that UTM tags are case sensitive, meaning that Source=Facebook and source=facebook will show as two separate sources in your analytics. We recommend to use lowercase throughout on all your UTM tags.