💡 HINWEIS
Bevor Sie mit der Installation beginnen, benötigen Sie Ihren individuellen iFrame-Link. Diesen erhalten Sie über den Chat im Admintool oder direkt von Ihrem persönlichen Ansprechpartner. Bitte nehmen Sie vorab Kontakt mit uns auf.
Wenn Sie die Teilnehmerregistrierung bzw. den Ticketverkauf über Ihre eigene Website betreiben wollen, bieten wir Ihnen eine iFrame Lösung an. Dabei wird der Ticketshop, der sich im unteren Bereich auf Ihrer Eventpage befindet, als iFrame zur Verfügung gestellt. Zur Verdeutlichung haben wir Ihnen den Bereich im folgenden Bild rot markiert:
Damit der Ticketshop auf Ihre Website integriert werden kann, benötigen Sie einen individuellen iFrame-Link, den Sie auf Anfrage über den Chat im Admintool erhalten oder von Ihrem Ansprechpartner. Der Link, den Sie erhalten, sieht in etwa wie folgt aus und besteht aus verschiedenen Parametern:
apiKey: Eine alphanumerische Zeichenfolge, die zur Sicherheit als Authentifikation dient
eventid: Die eindeutige Event-ID Ihrer Veranstaltung
Wie installiere ich den Link als iFrame auf meine Website?
Wenn Sie ein CMS nutzen, haben Sie mehrere Alternativen, um das iFrame zu installieren. Ihnen stehen entweder iFrame-Widgets zur Verfügung, in dem Sie nur den iFrame-Link eintragen müssen. Oder Sie verwenden ein HTML-Widget, dass Ihnen erlaubt benutzerdefinierten HTML-Code einzutragen.
Wenn Sie mit benutzerdefiniertem HTML arbeiten, stellen wir Ihnen zusätzlich zum iFrame selbst einen entsprechenden JavaScript Code für Sie zur Verfügung mit dem dynamisch die Höhe und Breite des iFrames angepasst wird. Dieser reagiert auf Änderungen des Nutzers im iFrame (bspw. Auswahl der Tickets) und passt dann die Höhe selbständig an. Dadurch wird die typische Scrollbar vermieden, welche vom Ticketkäufer als unschön wahrgenommen wird und sich im schlimmsten Fall auch negativ auf Ihren Verkaufserfolg auswirken kann.
Kopieren Sie folgenden Code:
<script>
window.onmessage = (event) => {
console.log("event", event);
var data = JSON.parse(event.data);
var iframeHeight;
if (data && data.type == "height" && data.data != iframeHeight) {
iframeHeight = data.value;
document.getElementById('iframe').style.height = parseInt(data.data) + 5 + 'px';
console.log("adjusted height", data.value);
}
};
</script>
<body>
<iframe id="iframe" src="IHR-IFRAME-LINK" allowpaymentrequest=true width="650px" height="650px" frameBorder="0">
</iframe>
Fügen Sie den Code an einer beliebigen Stelle im <body>-Bereich auf Ihrer Website ein.
Tauschen Sie das Wort IHR-IFRAME-LINK vollständig gegen den Link aus, den Sie über den Chat im Admintool oder von Ihrem Ansprechpartner erhalten haben.
Veröffentlichen Sie die getätigten Änderungen, um das iFrame auf Ihrer Webseite anzuzeigen.
Wenn Sie bspw. den Link
erhalten haben, würde Ihr Code entsprechend wie folgt aussehen:
Nachdem Sie die Änderungen auf Ihrer Webseite veröffentlicht haben, wird das iFrame sichtbar:
Erweiterte Query Parameter für fortgeschrittene User
Mit dem Query Parameter ticketTypeSearch können Sie Ticketkategorien im iFrame ein- und ausblenden. Dabei funktioniert der Query Paramter als search string und sucht nach der Zeichenfolge in allen Ticketkategorien der Event-ID, die nach dem ticketTypeSearch eingetragen wird. Hängen Sie nach einem &-Symbol ticketTypeSearch=XXX an. Zum Beispiel würde “&ticketTypeSearch=EarlyBird” alle Ticketkategorien anzeigen, die das Wort EarlyBird enthalten.
