Embedding on your website
If you have your own event website you should provide your attendees with the best registration experience by embedding your ticketshop/registration form directly on your page.
You do not need a developer to do this, we give you the code and you just need to copy/paste it to your page. You will find the code at the menu item "Sales channels -> Your website or app" in your event's administration area.
Here are some more advanced options you have while embedding the shop on your page.
Structure of our embedding code
The iframe's source is the URL to your event page (containing your event identifier) and multiple query parameters (explained in the next section). As sub-domain by default "<IDENTIFIER>-modules" is used to ensure users are on a fresh session and not "influenced" by possible sessions of ticketshop of other events. In case you are integrating multiple IFrames on your page, make sure that everyone has a unique subdomain (ending with "-modules") to ensure no session interference.
A standard (maximum) width is set for the iframe of 650px, feel free to adapt it if you want it to be wider (not recommended), if the container of the iframe is smaller than 650px the iframe will automatically reduce its width, so usually it is not needed to manually edit this parameter.
||This parameter must always be set to "iframe" (other values or missing parameter will return the full event page instead)|
||If set to "true" the iframe will automatically resize in height/width to make the content fit (recommended). If it is set to
||Allows tracking the registrations of your different channels (e.g how many tickets are sold on XING, in a XING app or in this iframe). You can set any (URL encoded) value here to name this channel, especially use-full if you integrate the shop on multiple pages and want to understand the success of each page (otherwise you can keep this parameter as its default)|
||Allows setting the language the shop should be initially shown in (if multiple languages in the shop are available the user can still choose a different language to continue). Allowed values are
||Main language defined in the event|
||Background color of the iframe in HEX format without hastag (e.g. FF0000 for red)||Background color defined in the event|
||Text color to be used in this iframe in HEX format without hastag (e.g. FF0000 for red)||Text color defined in the event|
||Link color to be used in this iframe in HEX format without hastag (e.g. FF0000 for red)||Link color defined in the event|
||This parameter can be used to pass the information to the iframe if the user has given his consent to marketing tracking ("Cookie Banners"). If the parameter is "false" or missing, Google Analytics, AdWords and Facebook Pixel tracking code will not be included in the shop.|
||The step in the shop to open. This can only be used if a purchase has already been started (via API), e.g. to pre-fill data in the registration process. Possible values are
||empty = ticket selection step|
||A token that loads an existing (previous) registration (or pre-registration). This parameter should only be of interest if a purchase is pre-filled vis API. See the example Pre-fill the ticketshop with buyer data via REST API for more details.||empty = new purchase|
||A token that loads the ticket from the reservation queue. This parameter should only be of interest if a purchase is pre-filled vis API. See the example Pre-fill the ticketshop with buyer data via REST API for more details.||empty = new purchase|
||We also allow integrating other modules from your XING Events event page beside the ticketshop. To identify those other modules their panel ID needs to be provided with this parameter. The integration of other modules is deprecated and we do not recommend to use them anymore, therefore this parameter can be discarded.||empty = ticketshop module|
Multiple ticket shop iframes on one website
If you want multiple ticket shop iframes on one website, there are a few things to keep in mind to make sure the resizing is working properly and sessions are not shared between the two shops:
- - Every iframe needs to have its own subdomain.
- - Every iframe needs to have an unique ID like:
<iframe src="https://<SOMETHING UNIQUE>-modules.xing-events.com/..." ... id="<ALSO SOMETHING UNIQUE>">
The ticket shop iframe is automatically responsive, that means if your webpage is viewed on a small screen, like a mobile device, the ticketshop automatically adapts its width and content to fit the screen and provide the user with the best usability.
In case this is not working on your website, please check the following:
- - Is your own webpage responsive? If your own page (i.e. the container the iframe is included in) doesn't resize properly, then the shop can't as well.
- - Is the shop iframe included within another iframe? If that outer iframe doesn’t adapt to the screen size of your visitor, neither does the ticket shop. So best take the ticket shop iframe out of the other iframe to ensure the best mobile experience for your visitors.