iframe

Intégrez l'Agent à votre site web professionnel à l'aide d'un iframe. Lorsque les utilisateurs visitent la page web cible, la fenêtre de chat de l'Agent se charge, offrant des services tels que le support client en ligne, la consultation avant-vente et la génération de leads.

Comment intégrer sur un site web

1. Rendez-vous sur Agent-Intégration-iframe et copiez le "Code d'intégration".
2. Collez le code à l'endroit souhaité dans la page HTML de votre site web.
3. Publiez le site web pour finaliser l'intégration de l'Agent IA et démarrer la conversation.
4. Si vous souhaitez personnaliser l'UI et le logo, contrôler la fréquence des messages utilisateurs ou afficher des messages proactifs pour augmenter le taux d'interaction, vous pouvez accéder aux paramètres avancés.

UI personnalisée

Cette fonctionnalité prend en charge la personnalisation de la taille, de la position, de la couleur, de l'icône, du logo et du nom de la bulle du widget.

• Surnom du widget : Permet une dénomination personnalisée.
• Description du widget : Permet d'ajouter une description personnalisée.
• Paramètres du thème : Permet de personnaliser la couleur du thème du widget, l'icône de la bulle et l'apparence de l'Agent.
• Personnalisation de la bulle : Permet de définir la position et la taille d'affichage de la bulle selon les besoins de l'entreprise.
• Personnalisation de la boîte de dialogue : Permet de définir la largeur et la hauteur de la fenêtre de chat selon les besoins de l'entreprise (pour la compatibilité avec les petits écrans, il n'est pas recommandé d'utiliser de grandes valeurs).
• LOGO de l'Agent :
  • LOGO de la plateforme : Affiche le logo GPTBots.
  • LOGO de l'organisation : Affiche le logo personnalisé téléchargé par l'entreprise ici. Tous les Agents de l'organisation utilisent le même logo d'organisation.
  • LOGO personnalisé : Affiche le logo personnalisé téléchargé. Chaque Agent peut utiliser un logo différent. Cette fonctionnalité est un privilège avancé et nécessite de contacter le service commercial pour l'activer.
  • Aucun LOGO : Le composant de la fenêtre de chat n'affiche aucun logo.

Sécurité et limitation de débit

• Liste blanche de domaines : Définit la plage de domaines où le "code d'intégration de la bulle du widget" peut être intégré. Si elle est désactivée, aucune restriction n'est appliquée.
  

• Limite de consommation de crédits : Définit la limite de consommation de crédits pour la "bulle du widget". Si elle est désactivée, aucune restriction n'est appliquée.
  

  • Jusqu'à 3 réglages possibles
  • Permet de définir la limite totale de consommation de crédits pour la bulle du widget sur une base "quotidienne/hebdomadaire/mensuelle"

• Limite de consommation utilisateur : Définit la limite de consommation de crédits pour chaque utilisateur. Si elle est désactivée, aucune restriction n'est appliquée.
  

  • Jusqu'à 3 réglages possibles
  • Permet de définir la limite de consommation de crédits pour chaque utilisateur sur une base "quotidienne/hebdomadaire/mensuelle"

• Limitation de débit utilisateur : Définit la limite de fréquence d'envoi de messages pour chaque utilisateur. Si elle est désactivée, aucune restriction n'est appliquée.
  

  • Jusqu'à 3 réglages possibles
  • Permet de définir la limite d'envoi de messages pour chaque utilisateur selon le "nombre de messages/période"
  • Lorsque la limite est dépassée, l'Agent ne répond plus et un message prédéfini est automatiquement envoyé.

Callback d'événements

Comment transmettre les événements de comportement utilisateur de la bulle du widget à GA4 ou à des systèmes tiers

1. Créez un événement de callback GA4, obtenez le secret de l'API Measurement Protocol et l'ID de mesure du projet cible GA4, puis renseignez-les.
2. Créez un événement de callback Webhook, sélectionnez l'événement de callback souhaité selon les instructions affichées, puis renseignez l'URL et les informations d'authentification.
   
3. "Activez" le callback dans la liste des callbacks d'événements et vérifiez si les données sont correctes dans GA4 ou à l'adresse Webhook. Une fois les données stockées avec succès, vous pouvez analyser les données utilisateur.

Utilisation avancée

Définir l'ID utilisateur

1. Option 1 : La règle d'adresse pour intégrer un iframe dans une page web est : iframe_url+?user_id=your_user_id

   Remarque : Permet aux développeurs d'Agent de définir un ID utilisateur

2. Option 2 : Définir dynamiquement l'ID utilisateur via un code JavaScript

                      
                      Array.from(document.getElementsByTagName('iframe')).filter(iframe => iframe.src.includes('gptbots')).forEach(iframe => iframe.contentWindow.postMessage('{"type":"UserId","data":"your_user_id"}', '*'))

                    

Définir l'e-mail utilisateur

Pour intégrer la page web via iframe, ajoutez l'e-mail de l'utilisateur à l'URL de l'iframe comme suit : iframe_url?email=somebody@mail.com
Remarque : Cela permet aux développeurs d'Agent de préremplir l'e-mail de l'utilisateur, afin que les utilisateurs n'aient pas à saisir leur adresse e-mail lors d'une demande de support humain. Si l'e-mail n'est pas défini, les utilisateurs devront fournir leur adresse e-mail avant de pouvoir initier une demande de support humain.

Définir des variables personnalisées

Les développeurs peuvent définir des valeurs temporaires pour des variables personnalisées, valables pour la conversation en cours. Cela permet une logique et des réponses dynamiques de la part de l'Agent.
Pour intégrer la page web via iframe avec des variables personnalisées, utilisez le format d'URL suivant : iframe_url?var_key1=value1&var_key2=value2

Format des données de callback d'événements

Les événements et attributs d'événements de la bulle du widget transmis via Webhook ou GA4 utilisent le format de données suivant. Veuillez les analyser et les stocker en conséquence.

                      
                      {
  "client_id": "",  //De préférence obtenu via la méthode gtag de GA4 pour récupérer le client id. Si non disponible, il est généré par GPTBots.
  "user_id": "",  //UserId défini par le développeur, null si non défini
  "event_name": "Afficher la bulle du widget",     //Nom de l'événement
  "event_params": {  
      "key1": "abc",  //Nom de l'attribut d'événement : valeur de l'attribut (chaîne)
      "key2": 123     //Nom de l'attribut d'événement : valeur de l'attribut (nombre)
    }
}