CENTRE D’AIDE

Plugin de chat web avec IA

Ajoutez un chat intelligent à votre site web pour accueillir automatiquement les visiteurs avec la même IA que WhatsApp.

Qu’est-ce que le Plugin de Chat ?

Le plugin de chat permet d’ajouter un assistant IA à n’importe quelle page web. Les visiteurs peuvent discuter directement avec l’IA sans besoin de WhatsApp, et vous pouvez les assister en utilisant les mêmes intégrations et fonctions que vous avez déjà configurées.

  • Réponses automatiques avec IA entraînée sur votre entreprise
  • Accès à la recherche de produits, clients et fonctions personnalisées
  • Support multilingue avec traduction automatique
  • 10 thèmes de design personnalisables
  • Mode flottant (bouton dans le coin) ou intégré (dans une div)

Comment activer le plugin

  1. Ouvre le tableau de bord de WAzion
  2. Dans le menu latéral, cliquez sur “Plugins“ → “Chat
  3. Activez l’interrupteur “Plugin actif
  4. Ajoutez votre domaine dans « Domaines autorisés » (ex : mitienda.com)
  5. Copiez le code d’intégration et collez-le sur votre site web

Code d’intégration

Copiez ce code et collez-le avant de fermer la balise </body> de votre site web :

<!-- WAzion Chat Web -->
<script>
(function(w,d,s,t){if(w.WazionPlugin)return;w.WazionPlugin={token:t};
var js=d.createElement(s);js.async=true;
js.src='https://www.wazion.com/plugins/chat/embed.js';
js.dataset.token=t;d.body.appendChild(js);
})(window,document,'script','TU_TOKEN_AQUI');
</script>

Le jeton est généré automatiquement lors de l’activation du plugin. Vous le trouverez dans la section de configuration du chat.

Mode intégré (optionnel)

Si vous préférez insérer le chat dans un conteneur spécifique plutôt que comme bouton flottant, enveloppez le code dans un div :

<div id="mi-chat" style="height: 500px;">
  <script>
  (function(w,d,s,t){if(w.WazionPlugin)return;w.WazionPlugin={token:t};
  var js=d.createElement(s);js.async=true;
  js.src='https://www.wazion.com/plugins/chat/embed.js';
  js.dataset.token=t;d.body.appendChild(js);
  })(window,document,'script','TU_TOKEN_AQUI');
  </script>
</div>

Le chat sera rendu à l’intérieur de la div conteneur au lieu d’être un bouton flottant.

Guide d’installation sur Shopify

Suivez ces étapes pour ajouter le chat à toutes les pages de votre boutique Shopify.

1

Accède à l’éditeur de thèmes

Dans votre tableau de bord d’administration Shopify :

  1. Va à Boutique en ligne dans le menu latéral gauche
  2. Cliquez sur Sujets
  3. Dans votre sujet actuel, cliquez sur le bouton ... (trois points)
  4. Sélectionnez Modifier le code
2

Cherche le fichier theme.liquid

Dans le panneau latéral gauche de l’éditeur :

  1. Cherche le dossier Layout
  2. Clique sur theme.liquid

Note : theme.liquid est le fichier principal qui se charge sur toutes les pages de votre boutique.

3

Localise l’étiquette </body>

Dans l’éditeur de code :

  1. Utilisez Ctrl+F (Windows) ou Cmd+F (Mac) pour rechercher
  2. Écris </body> et appuie sur Entrée
  3. Vous trouverez l’étiquette près de la fin du fichier
4

Colle le code du chat

Colle le code suivant JUSTE AVANT :

<!-- WAzion Chat Web -->
<script>
(function(w,d,s,t){if(w.WazionPlugin)return;w.WazionPlugin={token:t};
var js=d.createElement(s);js.async=true;
js.src='https://www.wazion.com/plugins/chat/embed.js';
js.dataset.token=t;d.body.appendChild(js);
})(window,document,'script','TU_TOKEN_AQUI');
</script>
<!-- /WAzion Chat Web -->
</body>

Important : Remplacez TU_TOKEN_AQUI par le token qui apparaît dans votre tableau de bord WAzion.

5

Enregistre les modifications

Cliquez sur le bouton Enregistrer dans le coin supérieur droit de l’éditeur.

6

Vérifie l’installation

Visite votre boutique dans une fenêtre de navigation privée. Vous devriez voir le bouton de chat dans le coin de l’écran.

Méthode alternative : Pixels personnalisés (Shopify Plus)

Si vous avez Shopify Plus, vous pouvez utiliser des Pixels personnalisés :

  1. Va à ParamètresConfidentialité du clientPixels personnalisés
  2. Cliquez sur Ajouter un pixel personnalisé
  3. Donne-lui un nom (ex : “WAzion Chat“)
  4. Dans le champ de code, collez :
analytics.subscribe("page_viewed", (event) => {
  if (window.WazionPlugin) return;
  window.WazionPlugin = {token: 'TU_TOKEN_AQUI'};
  const js = document.createElement('script');
  js.async = true;
  js.src = 'https://www.wazion.com/plugins/chat/embed.js';
  js.dataset.token = 'TU_TOKEN_AQUI';
  document.body.appendChild(js);
});

Guide d’installation sur WordPress

Option 1 : Avec plugin (recommandé)

Utilisez un plugin pour insérer du code dans le pied de page :

  1. Installez le plugin Insert Headers and Footers (de WPCode) ou similaire
  2. Allez à Extraits de codeEn-tête et pied de page
  3. Dans la section Pied de page, collez le code du chat :
<script src="https://www.wazion.com/plugins/chat/embed.js"
        data-token="TU_TOKEN_AQUI"></script>

Enregistre les modifications et le chat apparaîtra sur toutes les pages.

Option 2 : Modification de functions.php

Avertissement : Cette méthode requiert des connaissances de base en PHP. Faites une sauvegarde avant.

  1. Va à ApparenceÉditeur de fichiers du thème
  2. Sélectionnez functions.php dans la liste des fichiers
  3. Ajoutez ce code à la fin du fichier :
// WAzion Chat Web
function wazion_chat_script() {
    echo '<script src="https://www.wazion.com/plugins/chat/embed.js"
          data-token="TU_TOKEN_AQUI"></script>';
}
add_action('wp_footer', 'wazion_chat_script');

Guide étape par étape : Installation sur WooCommerce

Note : Le chat web fonctionne de la même manière sur WordPress et WooCommerce. La différence est que sur WooCommerce, l’assistant peut accéder au contexte des produits si vous avez configuré l’intégration WooCommerce dans WAzion.

1

Accédez à votre tableau de bord WordPress

Connectez-vous à votre tableau de bord WordPress et allez à ApparenceÉditeur de thèmes.

2

Localisez le fichier du thème

Localisez le fichier functions.php de votre thème enfant (Apparence → Éditeur de fichiers du thème → functions.php).

3

Ajoute le code du chat

Option 1 : Utilisez un plugin (recommandé)

Installe un plugin comme “WPCode“ (Insérer des en-têtes et des pieds de page) et collez le script dans la section “Body“ ou “Footer“ :

<script src="https://www.wazion.com/plugins/chat/embed.js"
        data-token="TU_TOKEN_AQUI"></script>

Option 2 : Ajoutez au functions.php de votre thème enfant

Avertissement : Cette méthode requiert des connaissances de base en PHP. Faites une sauvegarde avant.

Ajoute le code suivant au fichier functions.php de ton thème enfant :

add_action('wp_footer', function() { ?>
<script>
(function(w,d,s,t){if(w.WazionPlugin)return;w.WazionPlugin={token:t};
var js=d.createElement(s);js.async=true;
js.src='https://www.wazion.com/plugins/chat/embed.js';
js.dataset.token=t;d.body.appendChild(js);
})(window,document,'script','TU_TOKEN_AQUI');
</script>
<?php });
4

Sauvegarder et vérifier

Enregistrez les modifications et visitez votre boutique WooCommerce pour vérifier que le chat apparaît correctement sur toutes les pages.

Guide pour sites HTML/autres

Pour tout site web (HTML statique, React, Vue, Angular, etc.) :

Structure de base

Colle le code juste avant </body> dans ton fichier HTML :

<!DOCTYPE html>
<html>
<head>
    <title>Mi sitio web</title>
</head>
<body>
    <!-- Tu contenido aquí -->

    <!-- WAzion Chat Web - Pegar AQUÍ, antes de </body> -->
    <script src="https://www.wazion.com/plugins/chat/embed.js"
            data-token="TU_TOKEN_AQUI"></script>
</body>
</html>

Pour les applications SPA (React, Vue, Angular)

Vous pouvez charger le script dynamiquement :

// En tu componente principal o App.js
useEffect(() => {
  const script = document.createElement('script');
  script.src = 'https://www.wazion.com/plugins/chat/embed.js';
  script.dataset.token = 'TU_TOKEN_AQUI';
  script.async = true;
  document.body.appendChild(script);

  return () => document.body.removeChild(script);
}, []);

Dépannage

Le chat n’apparaît pas

  • Vérifie que le plugin est activé dans le tableau de bord
  • Vérifie que ton domaine figure sur la liste des domaines autorisés
  • Ouvre la console du navigateur (F12) et cherche des erreurs
  • Essayez dans une fenêtre de navigation privée pour exclure le cache

Erreur “Domaine non autorisé

  • Ajoutez votre domaine exact à la liste des autorisés (sans http:// ni /)
  • Si vous utilisez www, ajoutez à la fois “midominio.com“ et “www.midominio.com
  • Pour le développement local, ajoutez “localhost“ ou utilisez “*“ temporairement

Le chat apparaît mais ne répond pas

  • Vérifie que tu as des crédits disponibles sur ton compte
  • Vérifie que le jeton est correct
  • Vérifie si tu as atteint la limite de taux.

Options de configuration

Domaines Autorisés

Liste des domaines où le chat peut fonctionner. Pour des raisons de sécurité, l’utilisation est uniquement autorisée à partir des domaines que vous avez approuvés.

  • • mitienda.com
  • • *.mitienda.com (inclut les sous-domaines)
  • • * (tout domaine - uniquement pour le développement)

Mode d’affichage

Flottant

Affiche un bouton dans le coin de la page. En cliquant dessus, la fenêtre de chat s’ouvre.

Intégré

Le chat s’insère dans un conteneur div sur votre page, idéal pour les pages de contact.

Configuration du Bouton Flottant

  • Poste : En bas à droite, en bas à gauche, en haut à droite ou en haut à gauche
  • Icône: 6 icônes disponibles (bulle, message, support, robot, etc.)
  • Couleurs : Couleur de fond et couleur de l’icône personnalisables
  • Taille: Petit (48px), Moyen (60px), Grand (72px)
  • Animation: Aucune, pression ou rebond pour attirer l’attention
  • Info-bulle Texte qui apparaît en survolant le bouton

Sujets de Design

10 thèmes prédéfinis pour adapter le chat à votre marque :

Minimal Modern Classic Dark Ocean Sunset Forest Rose Slate Neon

Textes du Chat

Personnalisez les textes que voit le visiteur :

  • Titre de la discussion (en-tête)
  • Message de bienvenue
  • Espace réservé du champ de texte
  • Texte du bouton envoyer

Les textes sont automatiquement traduits dans la langue du visiteur.

Configuration de la langue

Détection automatique

Détecte automatiquement la langue du navigateur du visiteur.

Langue fixe

Toujours afficher dans une langue spécifique (ex : uniquement en espagnol).

Avec sélecteur

Détecte automatiquement mais permet au visiteur de changer manuellement la langue.

Comportement

  • Ouverture automatique Ouvre automatiquement le chat après X secondes
  • Sonnerie Reproduire le son à la réception d’un message
  • Image de marque Afficher “Propulsé par WAzion“ dans le chat

Contact et Transfert vers WhatsApp

Collecte les données du visiteur et propose de transférer la conversation sur WhatsApp :

  • Demander des coordonnées : Au début de la conversation, un formulaire est présenté pour que le visiteur saisisse son nom, son téléphone et son email. Ces données apparaîtront dans l’email de fermeture de session.
  • Champs obligatoires : Choisissez quels champs du formulaire de contact sont obligatoires : aucun (tous optionnels), email, téléphone, les deux, ou au moins un. Si un champ est requis, le visiteur ne pourra pas omettre le formulaire ni envoyer de messages tant qu’il ne l’a pas complété.
  • Sélecteur de pays sur le téléphone : Le champ de téléphone comprend un sélecteur de pays avec des drapeaux et un indicatif téléphonique. Le pays est détecté automatiquement en fonction de la langue du navigateur du visiteur.
  • Notes automatiques de conversation : Si le visite s’identifie par téléphone ou email, un résumé de la conversation avec l’IA est automatiquement généré et enregistré comme note dans le profil du client. Activez-le dans les paramètres de comportement du plugin.
  • Bouton “Parler à un agent“ : Affiche un bouton en haut du chat qui permet au visiteur de continuer la conversation par WhatsApp. Un résumé automatique est généré par IA pour que l’agent ait le contexte.
  • WhatsApp de transfert : Configurez le numéro de WhatsApp auquel le visiteur sera dirigé. L’IA peut également suggérer ce numéro pendant la conversation.

Limitation de débit (Limite de messages)

Protégez votre compte contre une utilisation excessive en configurant des limites par session :

  • Nombre maximum de messages par fenêtre temporelle (ex : 30 messages)
  • Fenêtre temporelle en minutes (ex : 60 minutes)

Invite du Chat

Vous pouvez écrire des instructions spécifiques pour le chat web ou synchroniser avec votre invite WhatsApp :

  • Modifier avec IA : Écris des instructions en langage naturel (ex : « ajoute les horaires d’ouverture de 9h à 18h ») et l’IA modifiera automatiquement ta demande. Tu verras un diff visuel avec les changements : texte ajouté en vert et supprimé en rouge.
  • Importer depuis un modèle général : Copie votre invite WhatsApp dans le plugin en un clic.
  • Historique des versions : Chaque fois que vous enregistrez, une version est créée. Vous pouvez restaurer n’importe quelle version antérieure.

Synchronisation automatique : Depuis l’Éditeur de Prompt, vous pouvez cocher l’option « Lors de l’enregistrement, mettre à jour le prompt du plugin web ». L’IA adaptera automatiquement votre prompt en supprimant les références à WhatsApp.

CSS personnalisé

Pour des réglages avancés, vous pouvez ajouter du CSS personnalisé qui sera appliqué au chat.

Fonctions de l’IA dans le chat

L’IA du chat a accès aux mêmes fonctions que ton assistant WhatsApp :

Recherche de Produits

L’IA peut rechercher des produits dans votre boutique et afficher des informations.

Informations sur les clients

Si vous avez un CRM ou votre boutique en ligne connectée, l’IA accède aux données du client.

Recherche Web

Si elle est activée, l’IA peut rechercher des informations sur internet.

Fonctions personnalisées

Vos fonctions personnalisées (appel de fonction) peuvent être activées pour le chat web depuis l’interrupteur “Fonctions personnalisées“ dans les paramètres du plugin.

Statistiques et Visionneur de Conversations

Métriques d’utilisation

Dans le tableau de bord, vous pouvez voir les métriques d’utilisation du chat :

  • Conversations totales
  • Messages totaux
  • Conversations au cours des 7 derniers jours
  • Sessions actives au cours des dernières 24 heures

Visionneuse de conversations

Vérifie toutes les conversations du chat avec tes visiteurs :

  • Filtre par période : Aujourd’hui, 7 jours, 30 jours, 90 jours, 1 an, tous, ou plage de dates personnalisée
  • Liste paginée : Parcourez toutes les conversations (10 par page)
  • Détail complet : Cliquez sur n’importe quelle conversation pour voir tous les messages
  • Informations du visiteur : Langue, nombre de messages et page d’origine

Ouvrir avec un message prédéfini

Vous pouvez ouvrir le chat avec un message prédéfini en ajoutant le paramètre ?Message= à l’URL :

https://mitienda.com/contacto?Message=Quiero información sobre el producto X

Le chat s’ouvrira automatiquement et enverra le message spécifié. Si vous avez configuré un formulaire de contact obligatoire, le visiteur devra le remplir avant que le message ne soit envoyé.

Questions fréquentes

Articles connexes

Assistant WAzion

Informations commerciales et support technique

Bonjour ! Je suis l’assistant de WAzion. Je peux vous aider avec des informations sur les tarifs et les plans, des questions techniques, la configuration, ou toute autre question concernant notre produit. Comment puis-je vous aider ?
Développé avec WAzion AI