Créer un widget web dans le tableau de bord

Configurez un widget cliquer-pour-parler pour votre site depuis la page Widgets web — aucun appel API requis.

La page Web Widgets (/dashboard/web-widgets) crée et gère les clés publiables qui alimentent le widget vocal intégrable de ThunderPhone. Tout ce que la version API de ce guide fait avec cURL, cette page le fait avec un formulaire — et génère en plus le code d’intégration pour vous.

Créer un widget#

1. Cliquez sur Nouveau widget et choisissez un mode
   • Mode agent — le widget exécute toujours l'agent que vous sélectionnez dans le menu déroulant. La configuration la plus simple.
   • Mode webhook — à chaque session du widget, ThunderPhone appelle l'URL de votre webhook et votre serveur renvoie la configuration de l'agent pour ce visiteur (routage par page, utilisateurs connectés, déploiements progressifs). Laissez l'URL vide pour utiliser le webhook par défaut de votre organisation ; lorsque vous saisissez une nouvelle URL, vous pouvez également la définir comme webhook par défaut de l'organisation.
2. Répertoriez les domaines autorisés

   Au moins un domaine est requis, et les navigateurs ne peuvent démarrer des sessions qu'à partir des noms d'hôte que vous répertoriez. Les caractères génériques de sous-domaines tels que *.example.com sont autorisés (ils correspondent aux sous-domaines, et non au domaine nu) ; les caractères génériques seuls tels que * sont refusés. La liste empêche la réutilisation occasionnelle de votre clé sur d'autres sites, mais ne constitue pas une authentification : un script hors d'un navigateur peut envoyer n'importe quel en-tête Origin. localhost n'est pas autorisé automatiquement en production ; ajoutez-le à la liste pour tester localement avec l'API de production.

3. Choisissez les surcharges du navigateur

   Cochez chaque paramètre de session envoyé par votre page : Contexte de page, Variables, Voix, Langue. Les nouveaux widgets n'en acceptent aucun, et une requête de session contenant un paramètre désactivé échoue avec 400. Votre clé est publique, n'autorisez donc que ce que vous utilisez. Consultez Surcharges du navigateur.

4. Nommez-le, activez-le, créez-le

   Le bouton Activer le widget contrôle si la clé accepte les sessions — vous pouvez créer un widget désactivé et l'activer au lancement.

Récupérer le code d’intégration#

Juste après la création (ou via le bouton Intégrer de chaque ligne), une boîte de dialogue d’intégration génère du code prêt à coller avec votre clé publiable déjà renseignée :

• React — un extrait <ThunderPhoneWidget /> pour les applications avec bundler.
• Balise script — une paire <script> CDN + feuille de style pour tout site.

La boîte de dialogue prévisualise également les options d’apparence de base — titre, couleur principale, position dans le coin et thème clair/sombre — et intègre vos choix dans l’extrait. Pour la référence complète des props, les hooks de style et l’option headless, consultez la documentation du SDK de widget.

Gérer les widgets depuis la liste#

Chaque ligne se modifie sur place :

• Mode / Agent — basculez entre le mode agent et le mode webhook, ou modifiez l’agent, avec des sélecteurs intégrés.
• Domaines — ajoutez ou supprimez des domaines autorisés sous forme d’étiquettes.
• Activer/désactiver — un interrupteur par widget ; les widgets désactivés cessent immédiatement d’accepter les sessions.
• Transférer vers une organisation — copiez ou déplacez le widget vers une autre organisation à laquelle vous appartenez (le déplacement le supprime d’ici).
• Supprimer — révoque la clé publiable ; le widget cesse de fonctionner immédiatement sur tous les domaines. Cette action est irréversible.

Les sessions de widget apparaissent dans l’historique des appels avec la même transcription, le même enregistrement et la même évaluation que les appels téléphoniques.

Étapes suivantes#