Guide-chat aanpassen met behulp van API's

Wanneer u Guide gebruikt om chat op uw website te implementeren, voegt u toegangspunten aan uw chat-implementatie toe. Vervolgens voegt u Guide-sjablonen toe voor weergave op een pagina of bepaalt u met behulp van regels precies wanneer chat aan websitebezoekers moet worden aangeboden.

U kunt de weergave en het gedrag van chat die met Guide is geïmplementeerd, aanpassen door de volgende JavaScript-API's te gebruiken. U moet deze code toevoegen aan de pagina's op uw website waar chat beschikbaar moeten zijn.

Test aanpassingen in een testomgeving voordat u ze vrijgeeft in uw productieomgeving. Zo voorkomt u dat uw websitebezoekers last hebben van storingen. Bovendien weet u dan zeker dat uw aanpassingen werken zoals bedoeld.

API-aanroepen voor chatgedrag

Met de aanroepen in dit gedeelte kunt u het gedrag van het Guide-chatvenster wijzigen.

Autorisatiecode instellen

Stelt een autorisatiecode in voor OAuth-flow. OAuth is een authenticatieprotocol. Hiermee kunt u een applicatie namens u met een andere applicatie laten communiceren zonder uw wachtwoorden bekend te maken. Dit moet worden aangeroepen voordat de chat wordt geïnitialiseerd.

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

Het eerste geautomatiseerde klantbericht aanpassen

Wanneer een chat begint in Guide, wordt een nieuwe caseGesloten De volledige conversatie met een agent via een kanaal. Een interactie kan bijvoorbeeld een telefoongesprek, een e-mailuitwisseling, een chatgesprek of een uitwisseling via social media zijn. gemaakt en toegevoegd aan de wachtrij zodra het eerste bericht van de chatsessie wordt verzonden. Een verborgen, geautomatiseerd bericht wordt namens de bezoeker verzonden wanneer de chatsessie begint. Hierdoor hoeven bezoekers minder lang op een agent te wachten. Het eerste bericht is verborgen voor het contact, maar de agent kan het wel zien.

Het standaardbericht is de tekst op de knop waarop de klant klikt om de conversatie te starten. U kunt de tekst van het eerste geautomatiseerde bericht op drie manieren aanpassen:

  • De standaard knoptekst overschrijven.

    cxone('chat','sendFirstMessageAutomatically', 'Hello');
  • Het oorspronkelijke bericht dynamisch aanpassen.

    cxone('chat','setFirstAutomatedMessageContent', 'Hello, I have a question');
  • De berichttekst aanpassen op de vertalingspagina.

Het eerste geautomatiseerde bericht zichtbaar maken voor klanten

Als u wilt dat de bezoeker het eerste geautomatiseerde bericht kan zien, voegt u deze aanroep toe aan uw script:

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

Het maken van een case uitstellen

Guide maakt een nieuwe case aan en voegt deze toe aan de wachtrij wanneer het eerste bericht van de chatsessie wordt verzonden. Een verborgen, geautomatiseerd bericht wordt namens de bezoeker verzonden wanneer de chatsessie begint. Hierdoor hoeven bezoekers minder lang op een agent te wachten. Chatsessies beginnen wanneer een bezoeker op het chatpictogram klikt om een conversatie te beginnen. Het eerste bericht is verborgen voor de bezoeker, maar de agent kan het wel zien.

U kunt instellen dat Guide wacht op het daadwerkelijke eerste bericht van de bezoeker voordat er een case wordt aangemaakt. Daarvoor gebruikt u deze aanroep:

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

Game-modus inschakelen

Hiermee kunnen bezoekers het spel Snake spelen terwijl ze wachten op een agent.

cxone('chat','allowGameMode');

Geautomatiseerde tevredenheidsenquête

Een tevredenheidsenquête kan automatisch worden gedetecteerd en weergegeven in een popup. Zo kunnen deze enquêtes worden gedetecteerd en al dan niet worden weergegeven.

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

API-aanroepen voor chatinformatie

Met deze aanroepen kunt u de informatie aanpassen die beschikbaar is voor bezoekers tijdens een chatsessie.

Klant-ID ophalen

Retourneert de unieke identificatiecode van de bezoeker in de chat.

cxone('chat','getCustomerIdentityId');

De klant-ID instellen

Stelt een unieke identificatiecode in voor de bezoeker in de chat.

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

Wachtrijteller verbergen

De wachtrijteller laat een bezoeker weten hoe snel er waarschijnlijk een agent beschikbaar zal zijn, op basis van de plaats waar de bezoeker zich bevindt in de wachtrij van de agent. U kunt de wachtrijteller verbergen nadat de bezoeker naar een agent is gerouteerd. Hierdoor kunnen agents klantkaarten uit hun inbox verwijderen zonder dat bezoekers dit merken.

cxone('chat','hideQueueCounterAfterAssignment');

De activiteitsstatus instellen

Hiermee wijzigt u het bericht in de activiteitenbalk. U kunt dit bijvoorbeeld gebruiken om uw responstijd voor een ChatberichtenGesloten Een asynchrone chatfunctie, waarmee klanten op elk gewenst moment een chatbericht kunnen sturen en dan op een antwoord wachten.-sessie aan te geven. Dit kan nuttig zijn omdat chatberichten een asynchrone vorm van chatten zijn, dus bezoekers moeten soms wachten om van een agent te horen.

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

De afbeelding van de agent instellen

Hiermee verandert u dynamisch de agentafbeelding die wordt weergegeven in het chatvenster. Guide gebruikt standaard de foto uit het profiel van de agent. Wanneer u deze aanroep in uw script opneemt, gebruikt u de afbeelding waarnaar wordt verwezen door de URL in het codefragment. Vervang de voorbeeld-URL door de URL van de afbeelding die u wilt gebruiken voor de chat.

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

De klantnaam instellen

Klantnaam is een veld in de pre-contact vragenlijst, die bezoekers moeten invullen voordat ze gaan chatten met een agent via een ChatberichtenGesloten Een asynchrone chatfunctie, waarmee klanten op elk gewenst moment een chatbericht kunnen sturen en dan op een antwoord wachten.-kanaal. Deze API-aanroep vult het veld dynamisch in.

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

De datumnotatie instellen

Stelt de datumnotatie in op absolute datumnotatie (01/01/2022) of relatieve datumnotatie (vandaag, maandag).

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

Landinstellingen instellen

Hiermee stelt u de landinstellingen in voor vertalingen in het chatvenster.

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

Case-informatie weergeven

Alleen voor ChatberichtenGesloten Een asynchrone chatfunctie, waarmee klanten op elk gewenst moment een chatbericht kunnen sturen en dan op een antwoord wachten.-kanalen. Toont case-informatie aan de bezoeker.

cxone('chat','showCaseInfo');

De knop Transcriptie verzenden tonen of verbergen

Als u de knop Transcriptie verzenden zichtbaar maakt, moet u het chatkanaal zodanig configureren dat bezoekers de chattranscriptie naar zichzelf kunnen sturen. Configureer deze optie voor Chatberichten of Live chat.

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

Systeemberichten tonen/verbergen

Toont of verbergt systeemberichten, zoals de geschiedenis van de agenttoewijzingen.

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

Algemene voorwaarden

Hiermee kunt u vanuit het chatvenster een document met Algemene voorwaarden beschikbaar stellen aan bezoekers. Deze functie voegt een knop toe aan het venster. U kunt het label en de stijl van de knop aanpassen en instellen wat er gebeurt wanneer bezoekers erop klikken. De actie On-click kan de Algemene voorwaarden weergeven als een intern venster of een externe link.

Een intern venster:

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

Een externe link:

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

Zo schakelt u de functie uit:

cxone('chat','hideTermsOfUse');

API-aanroepen voor aangepaste velden, labels en woordgroepen

Aangepaste velden maken en invullen

De aangepaste velden die u kunt gebruiken met deze aanroep zijn dezelfde als die u kunt gebruiken in Klantenkaart. Als u deze aanroep gebruikt voordat u een chatvenster opent, worden de velden in het pre-contact formulier ingevuld met de gegevens die u in de API-aanroep opneemt.

Zo definieert u de waarde van een aangepast veld voor een case:

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

Zo definieert u de waarde van een aangepast veld voor een Klantenkaart:

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

Labels en woordgroepen aanpassen

U kunt veel labels en woordgroepen die in Guide-chat worden gebruikt, aan uw wensen aanpassen en de aanpassingen definiëren. Als u woordgroepen of schermlabels dynamisch wilt wijzigen, gebruikt u de onderstaande API-aanroepen.

Zo kunt u één bericht of label wijzigen:

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

Zo kunt u meerdere berichten of labels wijzigen:

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

API-aanroepen voor het uiterlijk van het chatvenster

U kunt het uiterlijk van het door Guide gebruikte chatvenster aanpassen.

Toegewezen agent verbergen

cxone('chat','hideAssignedAgent');

Header verbergen

cxone('chat','hideHeader');

Klant-avatar tonen

cxone('chat','showCustomerAvatar');

Verzendknop tonen

cxone('chat','showSendButton');

Maximum aantal tekent instellen voor antwoordvak

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

API-aanroepen voor aangepaste CSS met gegevenskiezers

U kunt het uiterlijk van chatvensters aanpassen met behulp van aangepaste CSS en gegevenskiezers in uw API-aanroepen. Door middel van gegevenskiezers kunt u het gedeelte van het chatvenster instellen waarop u de aangepaste CSS wilt toepassen. Definieer de gegevenskiezer met behulp van het attribuut data-selector. Stel dit in op de naam van de chatvenstercomponent die u wilt wijzigen.

Gebruik deze API-aanroep als voorbeeld om aangepaste CSS met gegevenskiezers toe te voegen:

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

Gebruik aangepaste CSS-componenten uitsluitend met het attribuut data-selector. Gebruik geen Class-selectors of andere onderdelen van de JavaScript-code, zoals in dit voorbeeld:

.Widget__Widget___1qQCf { background: red; }

API-aanroepen voor integratie met externe applicaties

Met behulp van de API-aanroepen in dit gedeelte kunt u pushmeldingen ontvangen wanneer bepaalde chatgebeurtenissen plaatsvinden.

Actieve threads in het chatvenster herkennen

cxone('chat','getOngoingThreads');

Doorlopende contacten in het chatvenster herkennen

cxone('chat','getOngoingContact');

Pushmeldingen ontvangen voor specifieke chatgebeurtenissen

Een melding ontvangen voor één chatgebeurtenis:

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

Een melding ontvangen voor meerdere chatgebeurtenissen:

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

Een melding ontvangen voor alle chatgebeurtenissen:

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