Personnaliser Guide à l'aide de JavaScript

Pour utiliser Guide avec votre site Web, vous pouvez simplement intégrer Guide sur chaque page de votre site Web à l’endroit où vous souhaitez offrir une possibilité d’engagement.

Toutefois, si vous pratiquez le développement Web, et souhaitez personnaliser l’aspect et le comportement du widget Guide, vous pouvez utiliser des appels d’API Application Programming Interface. Allows you to automate certain functionality by connecting your CXone Mpower system with other software. pour le code JavaScript. Vous trouverez ci-dessous les types de modifications réalisables :

• Aspect et comportement du widget Guide : personnalisez l’aspect et le comportement du widget Guide. Cela inclut la modification de la taille du widget, la modification de la taille des boutons, l’affichage du widget en mode plein écran, etc.

• Préférences lorsque l’option de chat est proposée dans le widget Guide : personnalisez l’aspect et le comportement du chat lorsqu’il est proposé dans le widget Guide. Cela inclut la modification des informations dans la fenêtre de chat, la modification de l’aspect de la fenêtre de chat, la définition du code CSS personnalisé, etc.

• Préférences de rapport : personnalisez la façon dont Guide suit les engagements et les conversions. Vous pouvez utiliser ces API lors de la définition d’événements personnalisés, le stockage de variables de visiteurs, le stockage de données de conversion, l’affectation et le retrait de balises Web, etc.

Comprendre le fonctionnement de Guide

Le widget Guide est un module Web que CXone Mpower Loader charge sur votre site Web. Ce module Web contient une application JavaScript qui est intégrée dans le framework Svelte. L’application utilise des magasins d’état basique qui conservent une trace de la configuration de Guide, le modèle actif, les états de chat actifs, l’état de l’interface utilisateur, etc. Les valeurs de ces magasins d’état déterminent le contenu visible par l’internaute.

Lorsque vous intégrez Guide sur une page de votre site Web, et si un internaute visualise cette page, Guide extrait la configuration propre à votre locataire. Cette requête renvoie un résultat JSON avec des règles, des boutons, des points d’entrée, des traductions, des articles référencés et des indicateurs de fonctionnalités. Elle utilise ensuite le moteur de règles intégré pour traiter les règles et les conditions qui peuvent déboucher ou non sur un modèle ou une offre proactive sur la page.

Pour gérer les données des visiteurs entre les rechargements de page, Guide utilise le stockage local et le stockage de session. Cela permet à Guide de prendre en charge les domaines multiples sur les navigateurs compatibles. Cela signifie également que Guide n’a pas recours aux cookies de navigateurs.

Ajout d’appels JavaScript

1. Cliquez sur le sélecteur d'applications et sélectionnez Guide.

2. Cliquez sur Integrations. Une page s’affiche avec un code JavaScript propre à votre locataire.

3. Cliquez sur Copy code with Guide pour copier le code.
4. Collez l'extrait de code copié dans votre code ou dans un programme d'édition de texte.

5. Juste au-dessus de la balise </script> de fermeture du code que vous avez collé, ajoutez les appels JavaScript à utiliser. Dans l'illustration suivante, le commentaire indique où ajouter des appels.

   

   Pour plus de détails sur les appels que vous pouvez utiliser, consultez les GuideAPI liées aux widgets, les API liées au chat et les API liées aux rapports.

6. Copiez et collez l'intégralité du script, y compris les balises d'ouverture et de fermeture <script>, dans l'en-tête d'une page de votre site Web.

7. Consultez la page modifiée et assurez-vous que les personnalisations de Guide fonctionnent comme prévu.

8. Après avoir procédé à l’ensemble des tests et vous être assuré que le script final fonctionne comme prévu, copiez-le dans l’en-tête des pages devant utiliser cette personnalisation de Guide.

Définition du langage à utiliser pour Guide

Pour ignorer les paramètres de langue du navigateur et imposer l’affichage du contenu de Guide dans une langue spécifique, modifiez le script d’intégration. Ajoutez le paramètre locale à la commande cxone('guide','init');à la fin du script et spécifiez la langue voulue. Par exemple, vous pouvez sélectionner le français de la façon suivante :

cxone('init','####'); 
cxone('guide','init', {locale: 'fr-fr'});

Remplacez #### par votre identifiant de locataire à quatre chiffres.

Notez que le contenu que vous écrivez dans une offre proactive s'affiche toujours dans la langue dans laquelle il a été écrit. Cela suppose que vous ayez déjà configuré les chaînes de traduction de Guide pour le français.