Chatbot Wix : le guide d’intégration étape par étape

Wix propose une fonctionnalité de chat intégrée, mais il s’agit d’un simple outil de chat en direct qui nécessite un humain en face. Quand personne n’est en ligne, les visiteurs reçoivent un formulaire de contact. Ce n’est pas suffisant lorsque quelqu’un consulte votre site à 23 h en se demandant s’il doit réserver votre prestation ou acheter votre produit.

Un chatbot IA entraîné sur le contenu de votre site répond à ces questions instantanément, sans intervention humaine. Ce guide présente deux méthodes pour ajouter un chatbot à Wix, détaille la configuration de A à Z et explique comment obtenir les meilleurs résultats.

Chat intégré à Wix ou chatbot IA ?

Avant de passer à l’installation, il est utile de comprendre en quoi un chatbot IA dédié diffère de ce que Wix propose de base.

Wix Chat fonctionne si vous voulez des conversations humaines en temps réel. Mais la plupart des dirigeants de petites entreprises ne peuvent pas être en ligne toute la journée. Un chatbot IA comble ces lacunes et gère les questions répétitives qui constituent l’essentiel des demandes de visiteurs.

Vous pouvez utiliser les deux ensemble : le chatbot IA gère automatiquement les questions courantes, et Wix Chat reste disponible pour les cas nécessitant une touche humaine.

Ce qu’il vous faut avant de commencer

1. Un chatbot entraîné sur Agentkit.

Inscrivez-vous gratuitement, créez un chatbot, puis entraînez-le sur le contenu de votre site Wix. L’offre gratuite vous donne droit à 1 chatbot et 50 messages par mois.

Ajoutez l’URL de votre site Wix comme source d’entraînement. L’outil d’exploration indexe automatiquement vos pages. Ajoutez ensuite des paires Q&R pour vos sujets les plus importants (tarifs, horaires, processus de réservation, politique de retour).

Pour des conseils d’entraînement détaillés, consultez Comment entraîner un chatbot sur le contenu de votre site web.

2. Un forfait Wix Premium.

L’ajout de code personnalisé sur Wix nécessite un forfait Premium (n’importe quel niveau). Les sites Wix gratuits ne prennent en charge ni les intégrations HTML personnalisées, ni Velo.

Méthode 1 : l’intégration HTML (recommandée)

C’est la méthode la plus simple, et elle fonctionne pour tous les utilisateurs Wix disposant d’un forfait Premium. Vous ajoutez le script du chatbot via un élément d’intégration HTML dans l’éditeur Wix.

Étape 1 : récupérez votre code d’intégration

Dans le tableau de bord Agentkit, accédez aux Paramètres de votre chatbot puis à Publier. Deux options d’intégration s’offrent à vous. Pour Wix, utilisez le code d’intégration iframe :

<iframe
  src="https://cdn.agentkit.ai/embed/your-chatbot-id"
  style="width: 100%; height: 600px; border: none;"
  allow="clipboard-write">
</iframe>

Vous pouvez aussi utiliser le widget JavaScript, mais l’élément d’intégration HTML de Wix gère les iframes de façon plus fiable que les balises script. La méthode iframe est l’approche recommandée pour Wix.

Étape 2 : ajoutez l’intégration HTML à votre page

1. Ouvrez l’éditeur Wix de votre site.
2. Cliquez sur le bouton Add (l’icône bleue « + ») dans la barre d’outils de gauche.
3. Sélectionnez Embed Code puis Embed HTML.
4. Un élément HTML apparaît sur votre page. Cliquez dessus et sélectionnez Enter Code.
5. Passez à l’onglet Code (pas l’onglet URL).
6. Collez le code iframe de l’étape 1.
7. Cliquez sur Update.
8. Redimensionnez et positionnez l’élément à l’endroit où vous voulez que le chatbot apparaisse sur la page.

Étape 3 : l’afficher sur tout le site (facultatif)

La méthode d’intégration HTML ajoute le chatbot à une seule page. Si vous voulez le chatbot sur toutes les pages, deux options s’offrent à vous :

Option A : l’ajouter à l’en-tête ou au pied de page du site.

1. Dans l’éditeur Wix, cliquez sur la section Header ou Footer de votre page.
2. Ajoutez l’élément d’intégration HTML à l’en-tête ou au pied de page.
3. Comme l’en-tête et le pied de page apparaissent sur toutes les pages, le chatbot sera disponible sur l’ensemble du site.

Option B : utiliser la fonctionnalité « Custom Element » du Wix App Market.

1. Allez dans Add puis Embed Code puis Custom Element.
2. Configurez-le pour charger le script de votre chatbot sur toutes les pages.

L’option A est plus simple pour la plupart des utilisateurs.

Étape 4 : publiez et vérifiez

1. Cliquez sur Publish en haut à droite de l’éditeur Wix.
2. Visitez votre site en ligne (pas l’aperçu de l’éditeur).
3. Vérifiez que le chatbot apparaît et répond aux messages de test.
4. Vérifiez sur mobile pour valider la mise en page.

Méthode 2 : Velo by Wix (pour les développeurs)

Velo est la plateforme de développement intégrée à Wix. Si vous êtes à l’aise avec JavaScript, Velo vous donne un contrôle plus fin sur quand et comment le chatbot se charge.

Quand utiliser Velo

• Vous voulez que le chatbot se charge de façon conditionnelle (par exemple, uniquement pour les membres connectés, ou seulement sur certaines pages).
• Vous devez transmettre des données dynamiques au chatbot (par exemple, le nom du visiteur ou son niveau d’abonnement).
• Vous voulez déclencher des actions du chatbot par programmation.

Étape 1 : activez Velo

1. Dans l’éditeur Wix, cliquez sur Dev Mode dans le menu du haut.
2. Cliquez sur Turn on Dev Mode.
3. Le panneau de code apparaît en bas de l’éditeur.

Étape 2 : ajoutez le script via le code de la page

1. Sélectionnez la page où vous voulez le chatbot.
2. Dans le panneau de code en bas, vous verrez un fichier pour la page (par exemple, Home.js).
3. Ajoutez le code suivant pour charger le widget Agentkit dynamiquement :

$w.onReady(function () {
  const script = document.createElement('script');
  script.src = 'https://cdn.agentkit.ai/widget.js';
  script.setAttribute('data-chatbot', 'your-chatbot-id');
  script.async = true;
  document.body.appendChild(script);
});

4. Enregistrez et publiez.

Étape 3 : chargement sur tout le site via masterPage.js

Pour charger le chatbot sur toutes les pages :

1. Dans le panneau de code, ouvrez masterPage.js (ce fichier s’exécute sur toutes les pages).
2. Ajoutez le même code de chargement du script à l’intérieur de la fonction onReady.
3. Enregistrez et publiez.

Exemple de chargement conditionnel

Si vous voulez le chatbot uniquement sur certaines pages :

// masterPage.js
import wixLocation from 'wix-location';

$w.onReady(function () {
  const path = wixLocation.path;
  const chatbotPages = ['services', 'pricing', 'contact', 'faq'];

  if (chatbotPages.some(page => path.includes(page))) {
    const script = document.createElement('script');
    script.src = 'https://cdn.agentkit.ai/widget.js';
    script.setAttribute('data-chatbot', 'your-chatbot-id');
    script.async = true;
    document.body.appendChild(script);
  }
});

Ceci charge le chatbot uniquement sur vos pages Services, Pricing, Contact et FAQ.

Comparatif des solutions de chatbot pour Wix

Plusieurs outils de chatbot fonctionnent avec Wix. Voici comment les principales options se comparent.

Si vous voulez des réponses propulsées par l’IA, entraînées sur votre propre contenu, avec les options d’intégration les plus flexibles, Agentkit est le choix le plus solide. Si vous avez besoin d’un générateur de flux à base de règles sans IA, Joonbot est conçu spécifiquement pour cela. Et si vous avez simplement besoin d’un chat humain à humain basique, Wix Chat est déjà inclus dans votre forfait.

Personnaliser le chatbot pour votre site Wix

Une fois le chatbot en ligne, configurez ces paramètres dans le tableau de bord Agentkit pour obtenir les meilleurs résultats.

Couleurs de marque et position

Dans les Paramètres de votre chatbot, personnalisez l’apparence du widget :

• Couleur principale : faites-la correspondre à la couleur d’accent de votre site Wix.
• Position : en bas à droite par défaut, ce qui convient à la plupart des sites. Passez en bas à gauche si votre site Wix a un élément qui entre en conflit dans le coin inférieur droit.
• Message d’accueil : rédigez un message spécifique à votre activité. « Bonjour ! Je peux répondre à vos questions sur nos services, nos tarifs et nos disponibilités » vaut mieux que « Comment puis-je vous aider ? »

Restriction de domaine

Ajoutez votre domaine Wix à la liste des domaines autorisés. Cela inclut à la fois votre domaine personnalisé (par exemple, yourbusiness.com) et l’URL Wix par défaut (par exemple, yourbusiness.wixsite.com/yoursite). La restriction de domaine empêche toute utilisation non autorisée de votre chatbot.

Instructions personnalisées

Ajoutez des instructions qui façonnent le comportement du chatbot pour votre activité spécifique :

• « Si quelqu’un pose une question sur les tarifs, mentionnez toujours l’option de consultation gratuite. »
• « Pour les questions de disponibilité, suggérez de réserver via la page de planning. »
• « Ne promettez jamais de dates de livraison précises. Indiquez de nous contacter pour connaître les délais actuels. »
• « Si quelqu’un pose une question à laquelle vous ne pouvez pas répondre, proposez de collecter son e-mail pour un suivi. »

Collecte de prospects

Activez l’action de collecte de prospects pour recueillir les e-mails des visiteurs engagés. C’est particulièrement précieux pour les entreprises de services sur Wix, où convertir un visiteur en prospect est l’objectif principal.

Les prospects collectés apparaissent dans votre tableau de bord Agentkit. Connectez-les à votre outil d’e-mail marketing ou à votre CRM via Zapier. Voir le guide d’intégration pour plus de détails.

Conseils d’entraînement pour les sites Wix

Les sites Wix utilisent souvent des mises en page visuelles, des animations et des éléments interactifs qui peuvent limiter ce qu’un outil d’exploration parvient à extraire. Voici comment maximiser les connaissances de votre chatbot.

Complétez l’exploration avec des paires Q&R

Après avoir entraîné le chatbot sur votre URL, testez-le dans le Playground. Pour toute question à laquelle il répond mal, créez une paire Q&R avec la réponse idéale. Sujets courants à couvrir :

Importez des documents complémentaires

Si vous disposez de PDF, de menus, de brochures ou de catalogues de services, importez-les comme sources documentaires. Ils donnent au chatbot des informations détaillées qui ne figurent peut-être pas du tout sur votre site web.

Gardez vos données d’entraînement à jour

Lorsque vous mettez à jour votre site Wix, réentraînez le chatbot. Sur le forfait Standard ($119.99/mois) ou supérieur, le réentraînement automatique s’en charge automatiquement. Sur les forfaits Free ou Hobby, déclenchez un réentraînement manuel depuis le tableau de bord Agentkit après des changements de contenu significatifs.

Dépannage

Le chatbot n’apparaît pas après la publication

• Vérifiez votre forfait Wix. Le code personnalisé nécessite un forfait Premium.
• Consultez le site en ligne, pas l’éditeur. L’aperçu de l’éditeur Wix n’exécute pas toujours les scripts personnalisés.
• Videz le cache de votre navigateur ou utilisez une fenêtre de navigation privée.
• Vérifiez le code d’intégration HTML. Assurez-vous d’avoir collé l’iframe ou la balise script complète, sans caractères superflus.

L’élément d’intégration HTML affiche un espace vide

• Augmentez la hauteur de l’élément d’intégration HTML. La taille par défaut peut être trop petite pour afficher l’interface de chat.
• Vérifiez que l’URL src de l’iframe est correcte et inclut l’ID de votre chatbot.
• Vérifiez la console de votre navigateur (F12) pour repérer d’éventuelles erreurs de contenu bloqué.

Le chatbot fonctionne sur ordinateur mais pas sur mobile

Wix gère le design responsive automatiquement, mais les éléments d’intégration HTML nécessitent parfois un ajustement manuel pour le mobile. Dans l’éditeur Wix :

1. Passez à la vue de l’éditeur mobile.
2. Repérez l’élément d’intégration HTML.
3. Ajustez sa taille et sa position pour le mobile.
4. Publiez et testez.

Si vous utilisez le widget JavaScript via Velo (méthode 2), le widget est responsive par défaut et devrait fonctionner sur toutes les tailles d’écran sans ajustement.

Le chatbot donne des réponses inexactes

Il s’agit d’un problème d’entraînement, pas d’un problème d’intégration. Rendez-vous dans le tableau de bord Agentkit et :

1. Vérifiez quelles pages ont été explorées avec succès.
2. Ajoutez des paires Q&R pour les sujets aux réponses médiocres.
3. Testez dans le Playground jusqu’à ce que les réponses soient satisfaisantes.
4. Ajoutez des instructions personnalisées pour guider le ton et le comportement du chatbot.

Tarifs à prévoir

Voici comment les forfaits Agentkit correspondent aux cas d’usage typiques sur Wix.

La facturation annuelle fait économiser environ 20 % sur tous les forfaits payants.

Étapes suivantes

Votre site Wix dispose désormais d’un chatbot IA qui gère les questions des visiteurs à toute heure. Voici sur quoi vous concentrer ensuite :

1. Affinez les données d’entraînement en fonction de la première semaine de conversations. Repérez les tendances dans ce que demandent les visiteurs et comblez les lacunes de votre entraînement.
2. Activez la collecte de prospects pour transformer les conversations en contacts. C’est là que le chatbot se rentabilise.
3. Connectez vos outils via Zapier ou des webhooks. Envoyez vos prospects vers Google Sheets, Mailchimp, HubSpot, ou l’outil que votre équipe utilise. Voir le guide d’intégration.
4. Consultez le guide Squarespace si vous gérez des sites sur d’autres plateformes : Ajouter un chatbot à Squarespace.
5. Explorez toutes les options d’intégration dans le guide complet d’intégration.

Créez votre chatbot gratuitement →

Aucune carte bancaire requise.