Anpassen von Guide mit JavaScript

Wenn Sie Guide mit Ihrer Website verwenden möchten, können Sie Guide einfach auf jeder Seite Ihrer Website dort einbetten, wo Sie ein Engagement anbieten möchten.

Wenn Sie jedoch mit der Website-Entwicklung vertraut sind und Anpassungen am Erscheinungsbild und Verhalten des Guide-Widgets vornehmen möchten, können Sie API Application Programming Interface. Ermöglicht Ihnen die Automatisierung bestimmter Funktionen durch das Verbinden Ihres CXone Mpower-Systems mit anderer Software.-Aufrufe für den JavaScript-Code verwenden. Sie können diese Arten von Änderungen vornehmen:

• Guide-Widget-Erscheinungsbild und -Verhalten: Passen Sie Erscheinungsbild und Verhalten des Guide-Widgets an. Sie können zum Beispiel die Größe des Widgets oder die Größe der Schaltflächen ändern, das Widget im Vollbildmodus anzeigen usw.

• Chatvoreinstellungen, falls dies ein Angebot im Guide-Widget ist: Passen Sie das Erscheinungsbild und das Verhalten des Chats an, sofern dieser im Guide-Widget angeboten wird. Sie können zum Beispiel die Informationen im Chatfenster ändern, das Aussehen des Chatfensters ändern, benutzerdefiniertes CSS festlegen usw.

• Einstellungen für die Berichterstattung: Passen Sie das Guide-Tracking von Engagements und Conversions an. Sie können diese APIs verwenden, wenn Sie benutzerdefinierte Ereignisse definieren, Besuchervariablen speichern, Unterhaltungsdaten speichern, Web-Tags zuweisen oder entfernen und vieles mehr.

Verstehen Sie, wie Guide funktioniert

Das Guide-Widget ist ein Webmodul, das der CXone Mpower Loader auf Ihre Website lädt. Das Webmodul enthält eine JavaScript-Anwendung, die mit dem Svelte-Framework entwickelt wurde. Die Anwendung nutzt grundlegende Statusspeicher zum Tracken der Guide-Konfiguration, der aktiven Vorlage, des aktiven Chatstatus, des UI-Status usw. Die Werte dieser Statusspeicher bestimmen, was dem Besucher angezeigt wird.

Wenn Sie Guide in eine Seite Ihrer Website einbetten und ein Besucher die Seite aufruft, ruft Guide die für Ihren Mandanten spezifische Konfiguration ab. Diese Anforderung gibt ein JSON-Ergebnis mit Regeln, Schaltflächen, Einstiegspunkten, Übersetzungen, zugehörigen Artikelverweisen und Feature-Flags zurück. Dann wird die Regel-Engine verwendet, um die Regeln und Bedingungen zu verarbeiten, die bestimmen, ob eine Vorlage oder ein proaktives Angebot auf der Webseite eingeblendet wird oder nicht.

Um Besucherdaten zwischen dem Neuladen von Seiten zu verwalten, verwendet Guide lokalen und Sitzungsspeicher. So kann Guide in unterstützten Browsern domänenübergreifenden Support anbieten. Das bedeutet auch, dass Guide keine Browser-Cookies verwendet.

JavaScript Anrufe hinzufügen

1. Klicken Sie auf den App-Selector und wählen SieGuide.

2. Klicken Sie auf Integrations. Es wird eine Seite mit JavaScript-Code angezeigt, der für Ihren Mandanten spezifisch ist.

3. Klicken Sie auf Copy code with Guide, um den Code zu kopieren.
4. Fügen Sie den kopierten Codeausschnitt in Ihren Code oder ein Textbearbeitungsprogramm ein.

5. Fügen Sie direkt über dem schließenden </script>-Tag des eingefügten Codes die gewünschten JavaScript-Aufrufe hinzu. Im folgenden Beispielbild zeigt der Kommentar an, wo Aufrufe hinzugefügt werden sollen.

   

   Ausführliche Informationen zu den Aufrufen, die Sie verwenden können, finden Sie unter GuideWidget-bezogene APIs, Chat-bezogene APIs und Reporting-bezogene APIs.

6. Kopieren Sie das gesamte Skript, einschließlich der von Ihnen hinzugefügten öffnenden und schließenden <script>-Tags, in die Kopfzeile einer Seite Ihrer Website.

7. Besuchen Sie die geänderte Seite und prüfen Sie, ob die Guide-Anpassungen wie vorgesehen funktionieren.

8. Wenn Sie Ihr Skript vollständig getestet haben und es wie gewünscht funktioniert, kopieren Sie das endgültige Skript in den Header jeder Seite, die diese Guide-Anpassung enthalten soll.

Legen Sie die zu verwendende Sprache für Guidefest

Um die Spracheinstellung des Browsers zu umgehen und Guide-Besuchern Inhalte in einer bestimmten Sprache anzuzeigen, können Sie das eingebettete Skript bearbeiten. Fügen Sie den Parameter locale zum cxone('guide','init');-Befehl am Ende des Skripts hinzu und geben Sie die gewünschte Sprache an. So könnten Sie zum Beispiel Französisch als Sprache festlegen:

cxone('init','####'); 
cxone('guide','init', { locale: 'ja', templateId:'xxxxxxx'});

Ersetzen Sie #### durch Ihre vierstellige Mieter-ID.

Vorchat-Formular-Caching deaktivieren

Standardmäßig speichert das Guide-Widget die in den Kontaktformularen vor dem Chat und vor dem E-Mail-Versand eingegebenen Daten im Browser des Benutzers zwischen. Dadurch bleiben die Informationen auch nach einem Seitenneuladen oder in nachfolgenden Sitzungen erhalten.

In manchen Umgebungen, insbesondere solchen mit Compliance-, Datenschutz- oder Sicherheitsanforderungen, ist dieses Verhalten jedoch möglicherweise nicht wünschenswert. Dieses Verhalten lässt sich deaktivieren, indem Sie beim Initialisieren des Guide-Widgets das Konfigurationsflag disableFormCaching verwenden.

Wenn disableFormCaching nicht gesetzt ist oder auf false (Standardwert) gesetzt ist:

• Die Daten des Vorchat-Formulars werden im Browser zwischengespeichert.

• Zuvor eingegebene Werte werden möglicherweise automatisch angezeigt, wenn das Widget neu geladen wird oder eine neue Sitzung beginnt.

cxone('guide', 'init', { locale: 'en-US', disableFormCaching: false});

Wenn disableFormCaching auf true gesetzt wird und die Seite aktualisiert wird, wird das Widget neu geladen oder der Benutzer startet eine neue Sitzung:

• Die Felder des Vorchat-Formulars sind leer.

• Zuvor eingegebene Werte werden nicht wiederhergestellt.

Daher müssen die Nutzer ihre vor dem Chat eingegebenen Informationen für jede neue Interaktion erneut eingeben.