Comment ajouter le chatbot IA Asyntai à Umbraco

Plateforme :

Umbraco

HTML/Custom WordPress Shopify WooCommerce BigCommerce Ecwid Wix Squarespace Webflow Weebly HubSpot Tilda Adobe Experience Manager Duda Google Sites Bludit Plesk Concrete CMS Craft CMS Contentful Docusaurus Strapi Joomla Kentico Drupal Magento Blogger Bitrix TYPO3 PrestaShop OpenCart Ghost Hugo Statamic Umbraco Volusion Moodle SilverStripe Grav October CMS ProcessWire Sanity ExpressionEngine Sylius Backdrop CMS MODX Bagisto PayloadCMS e107 CrafterCMS Kirby MedusaCMS DatoCMS GoDaddy Framer Bubble Carrd Jimdo Strikingly Kajabi Teachable Thinkific ClickFunnels Hostinger Unbounce Leadpages Systeme.io Instapage

É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 :

Étape 2 : Modifier le modèle maître (recommandé)

La façon la plus simple d'ajouter le chatbot à toutes les pages est de modifier votre template Master :

1. Connectez-vous à votre back-office Umbraco
2. Accédez à Paramètres dans la barre latérale gauche
3. Développez Templates
4. Cliquez sur votre modèle Master (ou le modèle de mise en page principal utilisé par votre site)
5. Trouvez la balise fermante </body>
6. Collez votre code d'intégration Asyntai juste avant la balise </body>
7. Cliquez sur "Save"

Alternative : Utilisation du type de document Site Settings

Pour plus de flexibilité, vous pouvez ajouter un champ personnalisé pour gérer les scripts de pied de page :

1. Accédez à Paramètres → Types de document
2. Modifiez votre type de document Site Settings (ou créez-en un s'il n'existe pas)
3. Ajoutez une nouvelle propriété appelée « Footer Scripts » avec un type de données Textarea
4. Enregistrez le type de document
5. Go to Content and edit your Site Settings node
6. Collez votre code d'intégration Asyntai dans le champ Footer Scripts
7. Dans votre template Master, ajoutez ce code avant </body> :
   @Html.Raw(Model.Value("footerScripts"))
8. Enregistrez à la fois le contenu et le modèle

Alternative : Utilisation du dossier de scripts

You can also create a JavaScript file in the Umbraco Backoffice:

1. Accédez à Paramètres → Scripts
2. Faites un clic droit sur Scripts et sélectionnez « Create »
3. Créez un nouveau fichier appelé asyntai-chatbot.js
4. Ajoutez le code suivant :
   (function() {
  var script = document.createElement('script');
  script.async = true;
  script.src = 'https://asyntai.com/static/js/chat-widget.js';
  script.setAttribute('data-asyntai-id', 'YOUR_WIDGET_ID');
  document.body.appendChild(script);
})();
5. Replace YOUR_WIDGET_ID with your actual widget ID
6. Enregistrez le fichier
7. Incluez ce script dans votre template Master avant </body> :
   <script src="/scripts/asyntai-chatbot.js"></script>

Alternative : Par page avec RenderSection

Si vous souhaitez le chatbot uniquement sur des pages spécifiques :

1. Dans votre template Master, ajoutez avant </body> :
   @RenderSection("footerScripts", required: false)
2. In the specific page template where you want the chatbot, add:
   @section footerScripts {
  <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
}

Étape 3 : Vérifier l'installation

Après avoir enregistré vos modifications, visitez 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.