Logo de WAzion
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ètres → Confidentialité du client → Pixels 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 code → En-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 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

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 CRM ou Shopify connecté, 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

Tes fonctions personnalisées (appel de fonction) fonctionnent dans le chat.

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é.

Questions fréquentes

Articles connexes

Éditeur de prompt →

Configurez les instructions pour l’IA

Fonctions personnalisées →

Permets à l’IA d’appeler tes API

Système de Crédits →

Comprends comment fonctionnent les crédits

Intégrations →

Connectez Shopify et d’autres systèmes

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