Um die benutzerfreundlichen Widgets zur Erlebnis-Buchung ideal auf Ihrer Webseite einzusetzen, möchten wir Ihnen mit dieser Sammlung eine Hilfestellung geben. Bei der Einbindung sollte darauf geachtet werden, dass die Hürden für den Gast so gering wie möglich zu halten sind. Dazu zählen eine technisch einwandfreie und leicht zugängliche Einbindung, sowie die Vermeidung von Fehlern in Bezug auf die Bedienbarkeit. Je weniger Klicks ein Gast braucht, um zur Buchungsmöglichkeit zu gelangen, desto besser.
Einbauvarianten
Zum Einbau stehen grundsätzlich zwei Varianten zur Verfügung. Wir empfehlen den Einbau direkt in Ihre Seite, als Widget. Alternativ besteht jedoch die Möglichkeit einen eigenständigen Link zu verwenden und z.B. von einem Button (etwa eine „online buchen!“-Schaltfläche) aus, diesen direkt in einem neuen Fenster/Tab zu öffnen. Für beide Varianten bekommen Sie den Einbaucode bzw. den Link direkt im WebClient im Bereich Zusatzmodule/Erlebnis Widgets.
Es gibt 3 Widgets, zwischen welchen gewählt werden kann. Es kann eines der Widgets eingebaut werden, oder auch alle.
1. Listen-Ansicht
Die Listen-Darstellung zeigt eine Übersicht aller angebotenen Leistungen des Anbieters. Der Gast kann sich durch die gewünschten Leistungen klicken, im Detail ansehen und durchbuchen.
2. Detailseite
Die Detailansicht kann als eigenständiges Produkt auf die Website integriert werden. Möchte man beispielsweise bestimmte Leistungen besonders hervorheben oder verlinken.
3. Kalender-Widget
Für jede Leistung kann ein Kalender erstellt werden, welcher so in die Homepage integriert werden kann. Dies ermöglicht bereits bestehende Detailseiten unkompliziert, um die Buchungsmöglichkeit über den Kalender zu erweitern. Das Kalender-Widget kann nur mittels Java Script eingebunden werden.
Einbau als Widget
Mit der Einbauvariante als Widget wird die Buchungs-Funktionalität direkt in Ihrer Website angezeigt, und kann vom Gast direkt dort verwendet werden, ohne dass er Ihre Website verlassen muss.
Hierzu platzieren Sie den im WebClient angezeigten HTML-Code direkt an jener Stelle Ihrer Website, an welcher Sie das Such- und Buchungswidget einbinden wollen. Es handelt sich hierbei um eine Einbindung via Java Script.
Bitte beachten Sie, dass die Einbindung mittels iFrame oder Lightbox, nicht unterstützt wird.
Das Listen-Widget und das Detailseite-Widget sollten möglichst 100% der zur Verfügung stehenden Breite Ihrer Website einnehmen, da dadurch die beste Bedienbarkeit für den Gast gegeben ist, und es andernfalls zu Darstellungsproblemen kommt.
Weiters müssen die Seiten, auf die der TOSC eingebaut wird, weiterhin funktionieren, wenn Parameter angefügt werden. Als Beispiel der "?useDetailSearch=false"-Parameter, oder der "?datatransTrxId=123"-Parameter. Es gibt noch weitere Parameter, welche vom System automatisch dem Link angefügt werden. Aus dem Grund ist es notwendig, Parameter zuzulassen.
Die Website, auf welcher das Widget einbaut wird, muss "https" (SSL-Verschlüsselung) verwenden, da es ansonsten zu keinem Zahlungsabschluss des Gastes kommen kann!
Listen-Ansicht
Die Basis Ihres Widgets ist die "TagID" (im Codebeispiel unten "9e23f320-2d0b-4bc6-a92f-8d20496c4ec2").
Für weiterführende Funktionen des TOSC5 (z.B. Tracking) benötigen Sie diese.
Beispiel-Code für die Listen-Ansicht.
Der Code kann im WebClient unter “Zusatzmodule” > “Erlebnis-Widget” > “Liste Erlebnisse” > “Einbau in Website mit Java Script Code” bezogen werden.
<script> window.dw = window.dw || function () { (dw.q = dw.q || []).push(arguments); }; dw("settings", "9e23f320-2d0b-4bc6-a92f-8d20496c4ec2", { lang: "de", profileOverrides: ["teaser=false"], context: {} }); </script> <script async src="https://web5.deskline.net/start/ACCOWEB/9e23f320-2d0b-4bc6-a92f8d20496c4ec2/index.js"></script>
Detailseite
Die Basis Ihres Widgets ist die "TagID" (im Codebeispiel unten "9e23f320-2d0b-4bc6-a92f-8d20496c4ec2").
Für weiterführende Funktionen des TOSC5 (z.B. Tracking) benötigen Sie diese.
FRT steht in diesem Beispiel für den Datenbank-Code der Test-Umgebung. Dieser muss mit dem korrekten Kürzel der Datenhalter-Datenbank getauscht werden.
Beispiel-Code für die Detailseite.
Der Code kann im WebClient unter “Zusatzmodule” > “Erlebnis-Widget” > “Detailseite Widget” > “Einbau in Website mit Java Script Code” bezogen werden.
<script> window.dw = window.dw || function () { (dw.q = dw.q || []).push(arguments); }; dw("settings", "32747417-dacd-4af0-88b5-deb964f0726a", { lang: "de", profileOverrides: ["teaser=false"], context: { targetRoute: ["/experiences/FRT/32564ea8-060b-4158-b5e7-299d60c74921", "/erlebnisse/FRT/32564ea8-060b-4158-b5e7-299d60c74921", "/esperienze/FRT/32564ea8-060b-4158-b5e7-299d60c74921"] } }); </script> <script async src="https://web5.deskline.net/start/ACCOWEB/9e23f320-2d0b-4bc6-a92f8d20496c4ec2/index.js"></script>
Kalender-Widget
Die Basis Ihres Widgets ist die "TagID" (im Codebeispiel unten "9e23f320-2d0b-4bc6-a92f-8d20496c4ec2" für die Liste und “79c57f66-4049-4dca-af7d-b4dce3620119” für das Kalender-Widget).
Für weiterführende Funktionen des TOSC5 (z.B. Tracking) benötigen Sie diese.
FRT steht in diesem Beispiel für den Datenbank-Code der Test-Umgebung. Dieser muss mit dem korrekten Kürzel der Datenhalter-Datenbank getauscht werden.
Das div-Element definiert die Größe des Kalender-Widgets auf Ihrer Homepage. Dies ist das einzige Widget, dass nicht auf die volle Seitenbreite eingebaut werden soll. In diesem Beispiel verwenden wir eine Breite von 325 Pixel.
Beispiel-Code für die Detailseite.
Der Code kann im WebClient unter “Zusatzmodule” > “Erlebnis-Widget” > “Buchungskalender Widget” bezogen werden.
<div id="ElementID" style="max-width: 325px"></div> <script> window.dw = window.dw || function () { (dw.q = dw.q || []).push(arguments); }; dw("settings", "79c57f66-4049-4dca-af7d-b4dce3620119", { target: "ElementID", lang: "de", profileOverrides: [], context: { serviceId: "42564ea8-060b-4158-b5e7-299d60c74921", dbCode: "FRT" }, }); dw("onCheckout", "79c57f66-4049-4dca-af7d-b4dce3620119", function (e) { window .open( "https://web5.deskline.net/desklineweb/9e23f320-2d0b-4bc6-a92f-8d20496c4ec2?lang=de&shoppingListId=" + e.shoppingListId, "_blank" ) .focus(); }); </script> <script async src="https://web5.deskline.net/start/ACCOWEB/79c57f66-4049-4dca-af7d-b4dce3620119/index.js"></script></div>
Einbau als Link
Sollte es Ihnen nicht möglich sein einen HMTL-Code auf Ihrer Website zu platzieren, können Sie das Listen-Widget und die Detailseite als eigenständigen Link verwenden. Wir empfehlen im Header oder in einem ähnlich gut sichtbaren Bereich Ihrer Website einen prominenten Button oder Banner (z.B. „Preise & Buchen“, „Hier online buchen!“) zu platzieren, der bei Klick über den Link die Suchen & Buchen-Funktion als neuen Tab/neues Fenster im Webbrowser öffnet.
Weitere Informationen
Mobile Verwendung
Die Widgets sind für die Nutzung auf mobilen Geräten optimiert und vollständig responsive umgesetzt. Nutzen Sie wenn möglich die volle Breite der Website bei der Einbindung (Liste und Detailseite).
Designanpassung
Sie können direkt im WebClient sowohl die Farben, als auch die Schriftgröße des Widgets anpassen. Änderungen werden automatisch auch nach dem Einbau auf Ihrer Homepage übernommen. Dies bedeutet Sie müssen den Einbaucode, bzw. die Links nicht abändern.
Einschränkung auf einzelne Zimmer/Produkte
Es ist möglich die Widgets auf bestimmte Leistungen/Produkte einzuschränken. Den entsprechenden Code/Link können Sie direkt im WebClient abrufen.