Einbindung Digitaler Serviceberater auf der eigenen Website

In diesem Beitrag erklären wir, wie der Digitale Serviceberater auf Ihrer Homepage eingebunden wird. Diesen Beitrag können Sie auch direkt an Ihre Webagentur weitergeben.

Voraussetzungen

• Der Digitale Serviceberater ist in der S2 eingerichtet: Wie richte ich den Digitalen Serviceberater in der S2 ein?
• Ihre Homepage ist über HTTPS erreichbar.
• Die Adresse Ihrer Homepage ist in der S2 unter Chatagent Einstellungen > Verbindung > "Website-Origins (Soll)" eingetragen.
• Sie haben von uns das Paket "ai-advisor-widget" erhalten. Es enthält die Dateien widget.js, snippet.html, ai-advisor-widget.css (optional) und eine README.

Die Einbindung können Sie selbst vornehmen oder von Ihrer Webagentur durchführen lassen. Die Einbindung nimmt in der Regel Ihre Webagentur vor. Haben Sie keine Webagentur, sprechen Sie uns gern an. Wir vermitteln Ihnen die Einbindung über unseren Partner oder nehmen diese in seltenen Fällen selbst vor.

1. Zugangsdaten aus der S2 kopieren

Öffnen Sie in der S2 den Programmpunkt 2 - Sonstiges und dort 1 - Einstellungen, anschließend "Chatagent Einstellungen" und den Reiter "Verbindung". Kopieren Sie im Bereich Website-Integration die Werte "Chat-API-URL" und "Browser-API-Key".

Sind die beiden Felder leer, ist die S2 noch nicht registriert. Klicken Sie in diesem Fall im selben Reiter auf "Jetzt registrieren", siehe: Wie richte ich den Digitalen Serviceberater in der S2 ein?

Der Browser-API-Key ist später im Quelltext Ihrer Homepage sichtbar. Das ist so vorgesehen: Er funktioniert nur zusammen mit der in der S2 freigegebenen Homepage-Adresse.

2. Datei hochladen

Laden Sie die Datei widget.js (und optional ai-advisor-widget.css) auf den Webserver Ihrer Homepage hoch, in dasselbe Verzeichnis wie die Website.

3. Code einfügen

Fügen Sie den Inhalt der Datei snippet.html kurz vor dem schließenden </body>-Tag Ihrer Homepage ein und ersetzen Sie die beiden Platzhalter durch die Werte aus Schritt 1:

<script src="widget.js"
        data-api-url="CHAT-API-URL"
        data-api-key="BROWSER-API-KEY"></script>

Farben, Position und Schrift des Chats lassen sich optional über die Datei ai-advisor-widget.css anpassen. Name und Begrüßung übernimmt der Chat automatisch aus den Einstellungen in der S2.

4. Datenschutzerklärung ergänzen

Ergänzen Sie Ihre Datenschutzerklärung um einen Abschnitt zum Digitalen Serviceberater. Als Betreiber Ihrer Homepage sind Sie für die Datenschutzerklärung und die datenschutzkonforme Einbindung verantwortlich.

Als Hilfestellung stellen wir Ihnen auf Anfrage einen unverbindlichen Formulierungsvorschlag zur Verfügung. Melden Sie sich dazu gern bei uns. Dieser stellt keine Rechtsberatung dar. Bitte prüfen Sie ihn bzw. lassen Sie ihn von Ihrem Datenschutzbeauftragten prüfen und passen Sie ihn an Ihre Datenschutzerklärung an.

5. Testen

Öffnen Sie Ihre Homepage. Unten rechts erscheint der Chat-Button.

Stellen Sie eine Testanfrage im Chatfenster und prüfen Sie, ob diese im S2-Werkstattkalender ankommt: Wie bearbeite ich Online-Terminanfragen im S2-Werkstattkalender? Über "Neuer Chat" starten Sie eine neue Unterhaltung, über den Chat-Button öffnen und schließen Sie das Chatfenster.

Funktioniert etwas nicht, schauen Sie bitte in den Beitrag: Was kann ich tun, wenn der Digitale Serviceberater nicht funktioniert?