Passer au contenu principal
Le widget web permet aux visiteurs d’interagir avec ton agent IA par voix, chat, ou les deux simultanément. Configure tout via l’éditeur visuel—aucun codage requis—puis Copie et Colle un simple script d’intégration.

Créer Ton Widget

Dialogue Créer un Widget montrant le champ Nom du Widget avec texte de placeholder 'Entre le nom du widget', menu déroulant Agent pour sélectionner quel agent alimente le widget, boutons Annuler et Créer un Widget
Dialogue Créer un Widget montrant le champ Nom du Widget avec texte de placeholder 'Entre le nom du widget', menu déroulant Agent pour sélectionner quel agent alimente le widget, boutons Annuler et Créer un Widget
1

Ouvre le gestionnaire de widgets

Naviguez vers Web → Widgets dans le tableau de bord
2

Crée un nouveau widget

Clique sur Créer un Widget et Fournis :
  • Nom du widget - Étiquette interne pour ton référence
  • Agent - Sélectionne quel agent alimente ce widget
3

Configure le widget

Utilise les onglets de l’éditeur visuel pour personnaliser ton widget (voir sections ci-dessous)
4

Enregistre tes modifications

Clique sur Enregistrer les Modifications en bas à droite pour conserver toutes les mises à jour
5

Obtenez le code d'intégration

Va dans l’onglet Exporter et Copie ton script d’intégration unique

Onglets de Configuration

L’éditeur de widget comprend six onglets sur la gauche avec un aperçu en direct sur la droite qui se met à jour au fur et à mesure de tes modifications.
Interface de configuration du widget montrant la barre latérale gauche avec les onglets Configuration, Apparence, Contenu, Fonctionnalités, Actions, Confidentialité et Exporter, panneau de configuration principal avec champ Nom du Widget, menu déroulant Agent, champ Nom d'Affichage et saisie Domaines Autorisés, panneau d'aperçu en direct à droite montrant l'apparence du widget
Interface de configuration du widget montrant la barre latérale gauche avec les onglets Configuration, Apparence, Contenu, Fonctionnalités, Actions, Confidentialité et Exporter, panneau de configuration principal avec champ Nom du Widget, menu déroulant Agent, champ Nom d'Affichage et saisie Domaines Autorisés, panneau d'aperçu en direct à droite montrant l'apparence du widget
  • Nom du widget - Étiquette interne affichée dans ton liste de widgets
  • Agent - Basculez vers un agent différent à tout moment
  • Nom d’affichage - Nom visible par le client affiché dans le widget
  • Domaines autorisés - Restreins où le widget peut se charger (laissez vide pour autoriser tous les domaines)
Préréglages de Thème
  • Commence à partir de palettes de couleurs sélectionnées
  • Parcours les options de préréglages
Disposition
  • Position : en bas à gauche ou en bas à droite
  • Taille du widget et décalages par rapport aux bords
  • État initial : réduit, étendu ou toujours ouvert
Avatar
  • Effet “Pulsation IA” animé
  • Télécharge une image personnalisée
  • Lien vers une URL d’image externe
Couleurs & Dégradés
  • Couleurs d’arrière-plan et de CTA
  • Style des bulles de transcription
  • Couleurs de statut et dégradés d’orbe
Rayon de Bordure
  • Arrondi du bouton de lancement
  • Coins de la fenêtre de chat
  • Bulles de messages
  • Champ de saisie et bouton CTA
Animations
  • Effet de oscillation ou ondulation optionnel sur le bouton d’appel
Préréglages de Langue
  • Packs Anglais et Allemand pré-configurés
  • Définit toutes les étiquettes du widget et le texte légal
Messages de Bienvenue
  • Texte du message de bienvenue
  • Texte de placeholder
  • Messages de statut (écoute, parle, réfléchit, connexion)
Copie de Retour d’Information
  • Invitation aux retours
  • Texte du bouton de soumission
  • Message de remerciement
Remplacements d’Étiquettes
  • Personnalise les chaînes UI individuelles
  • Groupes : Chat, Contrôles, Transcription, Audio, Accessibilité
  • Mode chat uniquement - Désactive la voix, chat uniquement
  • Autoriser le texte pendant l’appel - Garde la saisie de texte active pendant les appels vocaux
  • Bascule de transcription - Afficher/masquer la transcription en direct
  • Contrôle de mise en sourdine - Afficher le bouton de sourdine pour permettre à l’utilisateur de couper son microphone
  • Minuteur d’appel - Afficher le temps écoulé
  • Branding - Afficher/masquer “Propulsé par itellicoAI”
  • Passer le message d’accueil - Éviter le message d’accueil si l’utilisateur tape en premier
  • Collecte de retours - Activer les retours post-appel (non stockés pour le moment, bientôt disponible)
Configure des outils côté client que ton agent peut invoquer pendant les conversations pour afficher des liens, ouvrir des pages ou déclencher des appels téléphoniques dans le navigateur de l’utilisateur.
Outils Client : Contrairement aux actions API qui s’exécutent sur ton serveur, les outils client s’exécutent directement dans le navigateur de l’utilisateur. Le LLM décide quand appeler ces outils en fonction du contexte de la conversation et de la description du déclencheur que vous Fournis.
Ajoute jusqu’à cinq outils client :
  • Texte du bouton - Étiquette affichée à l’utilisateur (ex : “Voir les tarifs”, “Appeler le support”)
  • URL - Lien web (https://) ou numéro de téléphone (tel:)
  • Déclencheur - Décris quand l’agent devrait invoquer cet outil (ex : “Quand l’utilisateur demande les tarifs”, “Quand l’utilisateur veut parler à un humain”)
  • Comportement :
    • Clic automatique - Ouvre automatiquement le lien lorsque l’outil est invoqué
    • Attendre la réponse - Affiche le bouton et attend que l’utilisateur clique (avec délai optionnel)
    • Terminer l’appel au clic - Termine automatiquement la conversation après que l’utilisateur a cliqué
Les liens de numéros de téléphone (tel:) terminent automatiquement l’appel après que l’utilisateur a cliqué.
Conditions & Confidentialité
  • Éditeur Markdown pour texte légal personnalisé
  • Copie par défaut fournie pour les nouveaux widgets
Paramètres de Consentement
  • Étiquettes des boutons accepter/rejeter
  • Clé de stockage local pour mémoriser le consentement
  • Exiger le consentement avant l’activation
Crée des liens de démonstration partageables pour les parties prenantes, clients ou membres de l’équipe pour tester ton widget sans l’intégrer sur un site web.Créer des Liens de Partage
  • Clique sur Créer un Lien pour générer une URL de page de démonstration
  • Ajoute optionnellement un nom pour identifier le lien
  • Définis l’expiration : 24 heures, 7 jours, 30 jours, jamais ou date personnalisée
  • Limite le nombre maximum de démonstrations si nécessaire
Gérer les Liens
  • Consulte tous les liens de partage existants avec date de création et expiration
  • Suis le nombre de démos et les statistiques de vues
  • Modifie les paramètres du lien (nom, expiration, démos max)
  • Supprime les liens qui ne sont plus nécessaires
Notes de Sécurité
  • Les liens de partage sont publiquement accessibles—traite-les comme des mots de passe
  • Définis des dates d’expiration pour un accès temporaire
  • Utilise des limites de démo pour des tests contrôlés
  • Supprime les liens quand ils ne sont plus nécessaires
Script d’Intégration
  • URL de chargement unique pour ton widget
  • Copier et coller avant la balise </body>
Guides d’Installation
  • Instructions étape par étape
  • Conseils spécifiques à la plateforme :
    • Google Tag Manager
    • WordPress
    • Webflow
    • Shopify
    • Wix
    • Squarespace

Déployez Ton Widget

1

Teste dans l'aperçu

Utilise l’aperçu en direct sur le côté droit du configurateur pour tester ton widget. Clique sur l’icône de rafraîchissement si nécessaire.
2

Copie le script d'intégration

Va dans l’onglet Exporter et Copie ton script d’intégration unique.
3

Ajoute à ton site web

Colle le script juste avant la balise de fermeture </body> sur ton site web.
4

Teste-le en direct

Charge ton site, Clique sur le widget et Teste une conversation vocale ou par chat. Consulte Conversations pour vérifier que la session a été enregistrée.
Les modifications de configuration que vous Effectue dans le tableau de bord s’appliquent automatiquement à ton widget intégré. Pas besoin de mettre à jour le script d’intégration. Si les modifications n’apparaissent pas immédiatement, Effectue un rafraîchissement complet (Ctrl+Shift+R ou Cmd+Shift+R).
Remarques :
  • Les restrictions de domaine s’appliquent immédiatement. Si configurées, le widget ne se charge que sur les domaines autorisés.
  • HTTPS requis pour l’accès au microphone (sauf localhost).
  • Responsive mobile - Le widget s’adapte automatiquement aux écrans mobiles.
  • Crée des widgets séparés pour différents sites ou besoins de branding.

Dépannage

  • Vérifie la console du navigateur pour les erreurs JavaScript
  • Vérifie que les domaines autorisés incluent ton site
  • Assure-toi que le script est placé avant la balise </body>
  • Vérifie les paramètres de Content Security Policy
  • HTTPS requis (sauf localhost)
  • L’utilisateur doit accorder l’autorisation manuellement
  • Vérifie les paramètres du microphone du navigateur
  • Certains navigateurs bloquent lors de la première visite
  • WebRTC nécessite des ports UDP ouverts
  • Les VPN d’entreprise peuvent bloquer WebRTC
  • Teste depuis un réseau différent
  • Vérifie les stats WebRTC du navigateur sur chrome://webrtc-internals
  • Clique sur Enregistrer les Modifications dans le configurateur
  • Rafraîchissement complet de ton site (Ctrl+Shift+R ou Cmd+Shift+R)
  • Vide le cache du navigateur si nécessaire
  • Vérifie que vous Modifie le bon widget

Prochaines Étapes