Comment ajouter le chatbot IA Asyntai à Adobe Commerce (Magento)

Guide étape par étape pour les sites Magento

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 : Utiliser le constructeur de pages (recommandé)

La façon la plus simple d'ajouter le chatbot est d'utiliser le bloc Code HTML du Page Builder :

Log in to your Magento Admin Panel
Accédez à Contenu → Pages
Modifiez votre page d'accueil (ou toute page sur laquelle vous souhaitez le chatbot)
Dans le Page Builder, faites glisser un élément « HTML Code » sur la page
Collez votre code d'intégration Asyntai
Cliquez sur "Save"
Videz le cache : Système → Gestion du cache → Vider le cache Magento

Important : L'utilisation du Page Builder ajoute le code uniquement à des pages individuelles. Pour une installation sur l'ensemble du site, utilisez la méthode Layout XML ci-dessous.

Alternative : Utilisation du Layout XML (toutes les pages)

To add the chatbot to all pages, create a layout file in your theme:

Accédez au dossier de votre thème : app/design/frontend/[Vendor]/[theme]/
Créez l'arborescence de dossiers si elle n'existe pas : Magento_Theme/layout/
Créez ou modifiez le fichier default_head_blocks.xml
Ajoutez le code suivant :
<?xml version="1.0"?> <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <head> <script src="https://asyntai.com/static/js/chat-widget.js" src_type="url" async="true" data-asyntai-id="YOUR_WIDGET_ID"/> </head> </page>
Replace YOUR_WIDGET_ID with your actual widget ID
Exécutez : bin/magento cache:flush
Exécutez : bin/magento setup:static-content:deploy -f (si en mode production)

Alternative : Utilisation d'un bloc CMS

You can also create a CMS block and include it in your footer:

Accédez à Contenu → Blocs
Cliquez sur "Add New Block"
Définissez un titre comme « Asyntai Chatbot »
Définissez l'identifiant sur asyntai_chatbot
In the content editor, switch to HTML mode and paste your embed code
Cliquez sur "Save Block"
Ajoutez le bloc à votre template de pied de page en utilisant : {{block id="asyntai_chatbot"}}
Videz le cache

Étape 3 : Vérifier l'installation

Après avoir enregistré vos modifications et vidé le cache, visitez votre boutique 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.