Guide-Chat mit APIs anpassen

Sie können das Erscheinungsbild und Verhalten des mit Guide implementierten Chats anpassen, indem Sie diese chatbezogenen APIs verwenden.

API-Aufrufe für Chatverhalten

Mit den Aufrufen in diesem Abschnitt können Sie das Verhalten des Guide-Chatfensters ändern.

Autorisierungscode festlegen

Legt einen Autorisierungscode für den OAuth-Ablauf fest. OAuth ist ein Authentifizierungsprotokoll. Es ermöglicht, dass eine Anwendung in Ihrem Auftrag mit einer anderen interagiert, ohne dass Sie Ihre Kennwörter preisgeben müssen. Es muss vor der Chatinitialisierung aufgerufen werden.

cxone('chat','setAuthorizationCode', 'authorization_code');

Anpassen der automatisierten Erstkontaktnachricht

Wenn ein Chat in Guide beginnt, wird ein neuer FallGeschlossen Das vollständige Gespräch mit einem Agenten über einen Kanal. Eine Interaktion kann zum Beispiel ein Anruf, eine E-Mail, ein Chat oder eine Unterhaltung in den sozialen Medien sein. erstellt und der Warteschlange hinzugefügt, wenn die erste Nachricht der Chatsitzung gesendet wird. Zu Beginn des Chats wird im Namen des Besuchers eine versteckte, automatische Nachricht gesendet. Dadurch wird die Wartezeit der Besucher auf einen Agenten verkürzt. Obwohl diese erste Nachricht für den Kontakt nicht sichtbar ist, kann der Agent sie sehen.

Die Standardnachricht ist der Text auf der Schaltfläche, auf die der Kunde klickt, um das Gespräch zu beginnen. Sie können den Text der ersten, automatischen Nachricht auf drei Arten anpassen:

  • Überschreiben des Standardtextes der Schaltfläche.

    cxone('chat','sendFirstMessageAutomatically', 'Hello');
  • Dynamische Änderung der Erstnachricht.

    cxone('chat','setFirstAutomatedMessageContent', 'Hello, I have a question');
  • Ändern des Nachrichtentextes auf der Seite "Übersetzungen".

Machen Sie die erste automatisierte Nachricht für Ihre Kontakte sichtbar

Wenn Sie möchten, dass der Besucher die erste automatische Nachricht sehen kann, fügen Sie Ihrem Skript diesen Aufruf hinzu:

cxone('chat','hideFirstSentMessage', false);

Fallerstellung verzögern

Guide erstellt einen neuen Fall und fügt ihn der Warteschlange hinzu, wenn die erste Nachricht der Chatsitzung gesendet wird. Zu Beginn des Chats wird im Namen des Besuchers eine versteckte, automatische Nachricht gesendet. Dadurch wird die Wartezeit der Besucher auf einen Agenten verkürzt. Chatsitzungen beginnen, wenn ein Besucher auf das Chatsymbol klickt, um ein Gespräch anzufangen. Obwohl die erste Nachricht für den Besucher nicht sichtbar ist, kann der Agent sie sehen.

Sie können Guide so konfigurieren, dass auf die tatsächliche erste Nachricht des Kontakts gewartet wird, bevor ein Fall erstellt wird. Verwenden Sie dazu diesen Aufruf:

cxone('chat','sendFirstMessageAutomatically', false);

Spielmodus aktivieren

Ermöglicht es Besuchern, das Spiel Snake zu spielen, während sie auf einen Agenten warten.

cxone('chat','allowGameMode');

Automatische Zufriedenheitsumfrage

Eine Zufriedenheitsumfrage kann automatisch erkannt und in einem Pop-up angezeigt werden. Mit dieser Option aktivieren oder deaktivieren Sie die automatische Erkennung und Anzeige.

cxone('chat','automatedSatisfactionSurveyModal', 'false');

API-Aufrufe für Chatinformationen

Mit diesen Anrufen können Sie die Informationen, die Besuchern während einer Chatsitzung zur Verfügung stehen, individuell anpassen.

Kunden-ID abrufen

Gibt die eindeutige Kennung des chattenden Besuchers zurück.

cxone('chat','getCustomerIdentityId');

Kunden-ID festlegen

Legt eine eindeutige Kennung für den chattenden Besucher fest.

cxone('chat','setCustomerId', 'customer_id');

Warteschleifenzähler ausblenden

Der Warteschleifenzähler zeigt einem Besucher an, wann ein Agent für ihn da sein wird. Dies basiert auf seiner Position in der Warteschlange des Agenten. Sie können den Warteschleifenzähler ausblenden, nachdem der Besucher erfolgreich zu einem Agenten geroutet wurde. So können Agenten Kundenkarten aus ihrem Eingang entfernen, ohne dass Besucher dies bemerken.

cxone('chat','hideQueueCounterAfterAssignment');

Aktivitätsstatus festlegen

Ändert die Nachricht in der Aktivitätsleiste. So können Sie beispielsweise Ihre Antwortzeit für eine ChatsitzungGeschlossen Asynchroner Chat, bei dem Kontakte jederzeit eine Chat-Nachricht senden und auf eine Antwort warten mitteilen. Dies könnte hilfreich sein, da es sich bei Chatnachrichten um eine asynchrone Form des Chats handelt, so dass die Besucher möglicherweise warten müssen, bis sie von einem Agenten hören.

cxone('chat','setStatusMessage', 'We typically reply within 3 hours.');

Bild des Agenten festlegen

Ändert dynamisch das im Chatfenster angezeigte Agentenbild. Standardmäßig verwendet Guide das Bild im Profil des Agenten. Wenn Sie diesen Aufruf in Ihr Skript einfügen, wird das Bild verwendet, das durch die URL im Codeschnipsel angegeben ist. Ersetzen Sie die Beispiel-URL durch die URL des Bildes, das Sie für den Chat verwenden möchten.

cxone('chat','setAgentImage', 'http://classics.com/images/agents/elizabeth_bennet.png');

Kundenname festlegen

Der Kundenname ist ein Feld im vor dem Kontakt anzuzeigenden Umfrageformular, das Besucher ausfüllen müssen, bevor sie mit einem Agenten in einem Chatnachrichten-KanalGeschlossen Asynchroner Chat, bei dem Kontakte jederzeit eine Chat-Nachricht senden und auf eine Antwort warten chatten. Dieser API-Aufruf füllt das Feld dynamisch aus.

cxone('chat','setCustomerName', 'Elizabeth');

Datumsformat festlegen

Legt das absolute Datumsformat (01/01/2022) oder das relative Datumsformat (heute, Montag) fest.

cxone('chat','setDateFormat', 'date_format');

Gebietsschema festlegen

Legt das Gebietsschema für Übersetzungen im Chatfenster fest.

cxone('chat','setLocale', 'locale');

Fallinformationen anzeigen

Nur für Chat-NachrichtenGeschlossen Asynchroner Chat, bei dem Kontakte jederzeit eine Chat-Nachricht senden und auf eine Antwort warten-Kanäle. Zeigt dem Besucher Informationen zum Fall an.

cxone('chat','showCaseInfo');

Schaltfläche "Transkript senden" ein-/ausblenden

Wenn Sie die Schaltfläche Transkript senden sichtbar machen, müssen Sie den Chatkanal so konfigurieren, dass Besucher das Chatprotokoll an sich selbst senden können. Konfigurieren Sie diese Option für Chatnachrichten oder Live-Chat.

cxone('chat','showSendTranscript');
cxone('chat','hideSendTranscript');

Systemmeldungen anzeigen/ausblenden

Blendet Systemmeldungen wie den Agentenzuweisungsverlauf ein oder aus.

cxone('chat','showSystemMessages');
cxone('chat','hideSystemMessages');

Nutzungsbedingungen

Ermöglicht Ihnen, Besuchern im Chatfenster ein Dokument mit den Nutzungsbedingungen zur Verfügung zu stellen. Diese Funktion fügt dem Fenster eine Schaltfläche hinzu. Sie können die Beschriftung und den Stil der Schaltfläche anpassen und festlegen, was passiert, wenn Besucher darauf klicken. Die On-Click-Aktion kann die Nutzungsbedingungen als internes Fenster oder externen Link anzeigen.

Ein internes Fenster:

cxone('chat','showTermsOfUse', 'Show terms of Use', 'modal' , 'Our terms of use are ...');

Ein externer Link:

cxone('chat','showTermsOfUse', 'Show terms of Use', 'externalLink' , 'http://yourdomain.com/terms-of-use');

So deaktivieren Sie die Funktion:

cxone('chat','hideTermsOfUse');

Benutzerdefinierte Felder, Bezeichnungen und Phrasen

Benutzerdefinierte Felder erstellen und befüllen

Die benutzerdefinierten Felder, die Sie für diesen Aufruf verwenden können, sind die gleichen wie die, die Sie in Kundenkarte verwenden können. Wenn Sie diese Aufrufe vor dem Öffnen eines Chatfensters verwenden, werden die Felder im vor dem Kontakt anzuzeigenden Formular mit den im API-Aufruf enthaltenen Daten ausgefüllt.

So definieren Sie den Wert eines benutzerdefinierten Feldes für einen Fall:

cxone('chat','setCaseCustomField', 'ident_of_custom_field', 'value_of_custom_field');

So definieren Sie den Wert eines benutzerdefinierten Feldes für eine Kundenkarte:

cxone('chat','setCustomerCustomField', 'ident_of_custom_field', 'value_of_custom_field');

Bezeichnungen und Phrasen anpassen

Sie können viele der Label und Phrasen, die in Guide-Chatkanälen verwendet werden, anpassen und die Anpassungen definieren. Wenn Sie die Phrasen oder Bildschirmbezeichnungen dynamisch ändern müssen, verwenden Sie diese API-Aufrufe.

So ändern Sie eine einzelne Nachricht oder eine Bezeichnung:

cxone('chat','setTranslation', 'key', 'your translation');

So ändern Sie mehrere Meldungen oder Bezeichnungen:

cxone('chat','setTranslations', {key1: 'your custom label', key2: 'your custom message'});

API-Aufrufe für das Erscheinungsbild des Chatfensters

Sie können das Aussehen des Guide-Chatfensters ändern.

Zugewiesenen Agenten ausblenden

cxone('chat','hideAssignedAgent');

Kopfzeile ausblenden

cxone('chat','hideHeader');

Kunden-Avatar anzeigen

cxone('chat','showCustomerAvatar');

Schaltfläche "Senden" anzeigen

cxone('chat','showSendButton');

Zeichenbegrenzung für das Antwortfeld festlegen

cxone('chat','setReplyBoxLimit', '280');

Benutzerdefiniertes CSS mit Datenauswahlen

Sie können das Erscheinungsbild von Chatfenstern mit benutzerdefiniertem CSS unter Verwendung von Datenselektoren in Ihren API-Aufrufen anpassen. Mit Datenselektoren können Sie den Teil des Chat-Fensters angeben, auf den Sie das benutzerdefinierte CSS anwenden möchten. Definieren Sie den Datenselektor mit dem Attribut data-selector. Geben Sie den Namen der Komponente des Chat-Fensters an, die Sie ändern möchten.

Um benutzerdefiniertes CSS mit Datenauswahlen hinzuzufügen, verwenden Sie diesen API-Aufruf als Referenz:

cxone('chat','setCustomCss', '[data-selector="CUSTOMER_MESSAGE_BUBBLE"] {color: white !important; background: black !important};');

Wenden Sie benutzerdefinierte CSS-Komponenten nur mit dem Attribut data-selector an. Wenden Sie sie nicht auf Klassenauswahlen oder andere Teile des JavaScript-Codes an, wie in diesem Beispiel:

.Widget__Widget___1qQCf { background: red; }

Integration mit Anwendungen von Drittanbietern

Mit den Aufrufen in diesem Abschnitt können Sie Push-Benachrichtigungen erhalten, wenn bestimmte Chatereignisse auftreten.

Erkennen aktiver Themen im Chat-Fenster

cxone('chat','getOngoingThreads');

Erkennen von laufenden Kontakten im Chat-Fenster

cxone('chat','getOngoingContact');

Push-Benachrichtigung für bestimmte Chat-Ereignisse erhalten

Um eine Benachrichtigung für ein Chat-Ereignis zu erhalten:

cxone('chat','onPushUpdate', 'event', callback);

Um eine Benachrichtigung für mehr als ein Chat-Ereignis zu erhalten:

cxone('chat','onPushUpdate', ['event', 'event', 'event'], callback);

Um eine Benachrichtigung für alle Chat-Ereignisse zu erhalten:

cxone('chat','onAnyPushUpdate', callback);