Quelle que soit la technologie de votre site — CMS propriétaire, framework JavaScript, site statique ou page builder — l'intégration d'un widget chatbot suit toujours le même principe : insérer un tag script HTML avant la balise </body>. La différence entre les plateformes réside uniquement dans la manière d'accéder à cet emplacement.
Le principe universel de l'intégration par script
Le widget Mira AI est distribué sous forme d'un script JavaScript externe hébergé sur les serveurs Mira AI. Lorsque ce script est chargé par le navigateur de l'utilisateur, il crée automatiquement l'interface du widget dans la page, charge les configurations définies dans le dashboard et établit la connexion avec le moteur IA.
Le script est asynchrone : il ne ralentit pas le chargement de votre page. Il se charge en parallèle du reste du contenu et s'initialise uniquement après le chargement complet de la page (événement DOMContentLoaded).
Intégration sur WordPress
WordPress offre deux méthodes principales pour injecter un script dans le footer : via l'éditeur de thème (fichier footer.php) ou via un plugin d'injection de code comme Header Footer Code Manager. La deuxième méthode est recommandée car elle survit aux mises à jour de thème.
- 1.Installez le plugin Header Footer Code Manager.
- 2.Créez un nouveau snippet, sélectionnez Footer comme position.
- 3.Collez le script Mira AI et activez sur tout le site.
- 4.Enregistrez et testez en navigation privée.
Intégration sur Shopify
Sur Shopify, le script s'insère dans le fichier theme.liquid via l'éditeur de code du thème (Boutique en ligne > Thèmes > Actions > Modifier le code). Localisez la balise </body> en bas du fichier et collez le script juste avant.
Intégration sur Webflow
Webflow propose un champ dédié pour les scripts personnalisés dans les paramètres du projet. Allez dans Project Settings > Custom Code, puis collez le script Mira AI dans la section "Footer Code". Ce code s'applique à toutes les pages publiées du projet.
Intégration sur Wix
Sur Wix, accédez à Paramètres > Avancé > Code personnalisé. Ajoutez un nouveau code, sélectionnez "Corps - fin" comme position de placement et cochez "Toutes les pages". Collez le script Mira AI et enregistrez. Republiez votre site pour que les changements prennent effet.
Intégration sur Squarespace
Squarespace permet l'injection de code via Paramètres > Avancé > Injection de code. Collez le script Mira AI dans la section "Pied de page" pour une intégration sur l'ensemble du site. Cette fonctionnalité est disponible sur les plans Business et supérieurs.
Intégration sur Prestashop
Sur Prestashop, l'intégration s'effectue via le module Hook ou directement dans le fichier de template footer.tpl du thème actif. Alternativement, le module gratuit "Custom HTML block" permet d'injecter du code sans modifier les fichiers du thème.
Intégration sur un site HTML statique ou personnalisé
Sur un site HTML pur, l'intégration est la plus simple : ouvrez chaque fichier HTML et collez le script avant </body>. Si votre site utilise un layout partagé (header/footer commun), une seule modification suffit.
| CMS / Plateforme | Méthode d'intégration | Difficulté | Temps estimé |
|---|---|---|---|
| WordPress | Plugin Header Footer Code Manager ou footer.php | Facile | 5 min |
| Shopify | Éditeur de code du thème (theme.liquid) | Facile | 5 min |
| Webflow | Project Settings > Footer Code | Très facile | 2 min |
| Wix | Paramètres > Code personnalisé | Très facile | 3 min |
| Squarespace | Paramètres > Injection de code | Très facile | 2 min |
| Prestashop | Module Hook ou Custom HTML block | Facile | 10 min |
| HTML statique | Édition directe des fichiers HTML | Très facile | 5 min |
| Next.js / React | Composant Script dans _app ou layout | Intermédiaire | 10 min |
Personnaliser le widget après intégration
L'intégration du script est la partie technique. La personnalisation — couleurs, logo, message de bienvenue, template de design — se fait entièrement depuis le dashboard Mira AI, sans toucher au code du site. Toute modification dans le dashboard est reflétée instantanément sur le widget intégré.
Vérifier le bon fonctionnement après intégration
Après chaque intégration, effectuez ces vérifications pour confirmer que le widget fonctionne correctement.
- Ouvrir le site en navigation privée (pour éviter les caches navigateur)
- Vérifier que le widget apparaît sur la page d'accueil et sur une page interne
- Envoyer un message test et vérifier que la réponse s'affiche
- Vérifier dans la console navigateur (F12) qu'aucune erreur JavaScript n'est liée au script Mira AI
- Vérifier que le widget n'interfère pas avec les autres éléments de la page (menu, formulaires)
Optimiser les performances de chargement
Le script Mira AI est conçu pour être performant : il est minifié, chargé de manière asynchrone et ne bloque pas le rendu de la page. Si votre site utilise un outil d'optimisation des performances (WP Rocket, NitroPack, Cloudflare), assurez-vous d'exclure le script Mira AI de la minification et de la concaténation JavaScript pour éviter tout conflit.
Créez votre chatbot gratuitement et intégrez-le en moins de 5 minutes
Obtenir mon code d'intégration