Pas de Guide-widget aan met behulp van API's

U kunt het uiterlijk en gedrag van de Guide-widget aanpassen met behulp van deze JavaScript-API's.

De CSS aanpassen

Wijzigt de CSS-elementen voor de Guide-widget. Voer alle CSS-wijzigingen in één keer door. Een tweede aanroep overschrijft de wijzigingen van de eerste aanroep.

Voorbeeldsyntaxis:

cxone('guide', 'setCustomCss', '[data-selector="GUIDE_CHANNEL_BACK_BUTTON"] {color: white !important; background: red !important;}');

Om een gegevensselector te verbergen, gebruikt u display:none. Om bijvoorbeeld de menuknop Guide te verbergen:

cxone('guide', 'setCustomCss', '[data-selector="GUIDE_MENU_BUTTON"] {display: none;}');

Grootte van kanaalknoppen aanpassen

Stelt de grootte voor kanaalknoppen in. Voer een waarde in ems of pixels in. De standaardgrootte voor knoppen is 3 em.

cxone('guide', 'setButtonSize', '80px');

Offset voor kanaalknoppen aanpassen

Stelt de offsetwaarde voor kanaalknoppen in. Voer een waarde in ems of pixels in.

cxone('guide', 'setOffsetX', '48px');
cxone('guide', 'setOffsetY', '3em');

Guide-menu openen

Opent het Guide-knoppenmenu.

cxone('guide', 'openMenu');

Guide-menu sluiten

Sluit het Guide-knoppenmenu.

cxone('guide', 'closeMenu');

Tekengrootte wijzigen

Stelt de standaardtekengrootte voor de Guide-widget in. Voer een waarde in pixels in. De standaardtekengrootte is 13 pixels. De hier ingestelde waarde bepaalt de em-grootte die overal in Guide wordt gebruikt.

cxone('guide','setFontSize',12);

Hoogte van Guide-widget wijzigen

Stelt de hoogte van de Guide-widget in. Voer een waarde in ems of pixels in. De standaardhoogte is 40 em. De maximale hoogte is 40 rem.

cxone('guide','setDesiredGuideHeight','30em');

Breedte van Guide-widget wijzigen

Stelt de breedte van de Guide-widget in. Voer een waarde in ems of pixels in. De standaardbreedte is 23,125 em.

cxone('guide','setDesiredGuideWidth','608px');

Guide op volledige schermgrootte weergeven

U kunt Guide op volledige schermgrootte weergeven. Guide-inhoud verschijnt niet in de Guide-widget maar in een venster.

cxone('guide','setFullDisplay');

Bij weergave op volledige schermgrootte kunt u de knop Minimaliseren het beste verbergen. Hiervoor gebruikt u de volgende opdrachten:

cxone('guide','setFullDisplay');
cxone('guide', 'setCustomCss', '[data-selector="GUIDE_CHANNEL_CLOSE_BUTTON"] {display: none !important;}');

Verberg de chat-precontact-enquête

Met deze API kunt u Guide instrueren om een chat te beginnen zonder de pre-contact webvragenlijst weer te geven.

cxone('guide','hidePreSurvey');

Gebruik de chat-API's om waarden voor pre-contact webvragenlijsten vooraf in te stellen. U kunt ze ook opgeven als parameters voor de hidePreSurvey-API. Bijvoorbeeld:

cxone('guide','hidePreSurvey', 'Dre', {email: "dre@classics.com"});

Aangepaste veldwaarden instellen voor precontactonderzoek

Met deze API kunt u waarden instellen voor aangepaste velden die in een precontactenquête worden weergegeven. U kunt de waarden instellen voor het volgende:

  • Naam

  • Elk aangepast veld voor contact

  • Elk aangepast veld voor klant

U kunt een aangepaste veldwaarde markeren als verborgen:waar. Het verborgen veld wordt niet weergegeven in het precontact-enquêteformulier. Maar de waarde die u voor het verborgen veld instelt, wordt doorgegeven aan het chatvenster.

Voor aangepaste velden die niet zijn gemarkeerd als verborgen:onwaar, stelt Guide de aangepaste velden in de precontactenquête vooraf in met de waarden die zijn opgegeven door de API-opdracht. De bezoeker kan de standaardwaarden gebruiken of deze naar eigen wens wijzigen.

Het volgende syntaxisvoorbeeld laat zien hoe u een naam kunt opgeven die verborgen is en rechtstreeks aan de chat wordt doorgegeven:

cxone('guide','setCustomFields', customerName: {value:"Francis", hidden: true});

Het volgende syntaxisvoorbeeld laat zien hoe u twee aangepaste contactpersoonveldwaarden kunt opgeven. De waarde e-mail is verborgen in de precontactenquête en wordt rechtstreeks doorgegeven aan de chat. De waarde van het adres is zichtbaar en kan worden bewerkt in de precontactenquête.

cxone('guide','setCustomFields', 
contactCustomFields:[
{ident:email', value: 'josey@nice.com', hidden:true},
{ident: 'address', value: '123 Main St', hidden:false}
]);

Het volgende syntaxisvoorbeeld laat zien hoe u een aangepast klantveld kunt opgeven:

cxone('guide','setCustomFields', 
contactCustomerFields:[
{ident: 'email', value: 'kaya.sanchez@acme.com'}
]);

Het volgende syntaxisvoorbeeld laat zien hoe u zowel een aangepast contactpersoonveld als een aangepast klantveld kunt opgeven:

cxone('guide','setCustomFields', 
contactCustomFields:[{ident:email', value: 'josey@nice.com', hidden:true}, {ident: 'address', value: '123 Main St', hidden:false}], contactCustomerFields:[{ident: 'email', value: 'kaya.sanchez@acme.com'}]);

Een toegangspunt direct weergeven

Met deze API kunt u een toegangspunt handmatig in een venster weergeven. De standaardknop voor het toegangspunt wordt gebruikt.

Deze API dient voor specifieke situaties waarin iemand handmatig een toegangspunt in een venster wil weergeven. Dit wordt in de regel niet aanbevolen, en de API dient niet in combinatie met Guide-betrokkenheidsregels te worden gebruikt.

Als u deze API wilt gebruiken, moet u de ID van het weer te geven toegangspunt doorgeven. U kunt de toegangspunt-ID ophalen door naast het toegangspunt op Bewerken te klikken en vervolgens het laatste gedeelte van de pagina-URL te kopiëren.

cxone('guide','openEntrypoint','e1348160-2016-4d91-958e-fd063c669fe6');