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 :

Connectez-vous à votre panneau d'administration Magento
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)

Pour ajouter le chatbot à toutes les pages, créez un fichier de mise en page dans votre thème :

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>
Remplacez YOUR_WIDGET_ID par votre identifiant de widget réel
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

Vous pouvez également créer un bloc CMS et l'inclure dans votre pied de page :

Accédez à Contenu → Blocs
Cliquez sur "Add New Block"
Définissez un titre comme « Asyntai Chatbot »
Définissez l'identifiant sur asyntai_chatbot
Dans l'éditeur de contenu, passez en mode HTML et collez votre code d'intégration
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.