Comment ajouter le chatbot IA Asyntai à Kentico

Guide étape par étape pour les sites Kentico CMS

Plateforme :

Étape 1 : Obtenir votre code d'intégration

Tout d'abord, rendez-vous sur votre Tableau de bord Asyntai et faites défiler jusqu'à la section « Code d'intégration ». Copiez votre code d'intégration unique qui ressemblera à ceci :

<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>

Note : Le code ci-dessus n'est qu'un exemple. Vous devez copier votre propre code d'intégration depuis votre Tableau de bord car il contient votre identifiant de widget personnel.

Étape 2 : Ajouter le code au modèle de page maître (recommandé)

Pour ajouter le chatbot à toutes les pages de votre site Kentico en une seule fois, utilisez la méthode Master Page Template :

Connectez-vous à votre administration Kentico et accédez à l'application Page templates
Localisez et ouvrez votre modèle de page maître (le modèle utilisé sur toutes les pages)
Cliquez sur l'onglet Header dans l'éditeur de modèle
Dans la section d'en-tête, collez votre code d'intégration Asyntai
Alternativement, ajoutez le code dans la mise en page du template avant la balise fermante </head>
Cliquez sur Save pour appliquer les modifications
Videz le cache de votre site et vérifiez les modifications sur le site en production

Astuce : L'utilisation du Master Page Template garantit que le chatbot apparaît sur chaque page qui hérite de ce template. C'est la méthode la plus efficace pour un déploiement sur l'ensemble du site dans Kentico.

Méthode alternative 1 : En-tête du template de page

Si vous souhaitez ajouter le chatbot à des modèles de page spécifiques uniquement :

Accédez à l'application Page templates dans l'administration Kentico
Sélectionnez le modèle de page spécifique que vous souhaitez modifier
Cliquez sur l'onglet Header
Ajoutez votre code d'intégration Asyntai à l'aide d'une balise script :

<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>

Cliquez sur Save
Toutes les pages utilisant ce template incluront désormais le chatbot

Note : Cette méthode est utile lorsque vous souhaitez ajouter le chatbot à des sections spécifiques de votre site qui partagent le même template de page, plutôt qu'à l'ensemble du site.

Méthode alternative 2 : Composant WebPart HTML HEAD

Pour un contrôle plus précis sur des pages spécifiques ou pour un JavaScript héritable entre sous-pages :

Ouvrez la page que vous souhaitez modifier dans l'éditeur de page Kentico
Ajoutez un nouveau composant WebPart à la page (de préférence dans une page parente pour l'héritage)
Recherchez et sélectionnez le composant WebPart HEAD HTML
Dans la configuration du composant WebPart, collez votre code d'intégration Asyntai
Configurez le composant WebPart comme héritable si vous souhaitez que les pages enfants disposent du chatbot
Cliquez sur OK pour enregistrer le composant WebPart
Enregistrez et publiez la page

Astuce : Le composant WebPart HEAD HTML est parfait pour ajouter du code à une page parente qui se propagera automatiquement à toutes les pages enfants, créant une installation à l'échelle de la section.

Méthode alternative 3 : Fichiers JavaScript personnalisés (avancé)

Pour les développeurs qui préfèrent gérer les scripts sous forme de fichiers :

Dans votre projet Kentico, accédez au répertoire ~/CMSScripts/Custom/
Créez un nouveau fichier JavaScript (par ex., asyntai-widget.js)
Ajoutez du code pour charger dynamiquement votre widget Asyntai :

(function() {
    var script = document.createElement('script');
    script.src = 'https://asyntai.com/static/js/chat-widget.js';
    script.setAttribute('data-asyntai-id', 'YOUR_WIDGET_ID');
    script.async = true;
    document.head.appendChild(script);
})();

Référencez ce fichier dans l'en-tête de votre modèle de page maître :

<script src="~/CMSScripts/Custom/asyntai-widget.js"></script>

Important : Cette méthode avancée nécessite un accès au système de fichiers et une connaissance de la structure de répertoires de Kentico. Assurez-vous de disposer des autorisations appropriées et testez toujours dans un environnement de préproduction au préalable.

Étape 3 : Vérifier l'installation

Après avoir enregistré vos modifications et vidé le cache, ouvrez votre site web dans un nouvel onglet de navigateur ou en navigation privée. Vous devriez voir le bouton du widget de chat dans le coin inférieur droit. Cliquez dessus pour vérifier qu'il s'ouvre et fonctionne correctement.

Vous ne voyez pas le widget ? Assurez-vous d'avoir enregistré toutes les modifications et vidé le cache de Kentico (Settings > System > Clear cache). Essayez de consulter votre site dans une fenêtre de navigation privée. Vérifiez la console du navigateur (F12) pour toute erreur JavaScript qui pourrait empêcher le chargement du widget.