Intégration Bubble
Ajoutez un chatbot IA à votre app Bubble
Entraînez un agent sur les pages publiques, la documentation et la FAQ de votre app, puis ajoutez-le à chaque page depuis les réglages d'en-tête et de body personnalisés de Bubble. Aucun plugin, et vous pouvez le tester d'abord dans le Playground.
Dernière mise à jour:
Comment intoCHAT fonctionne sur Bubble
Bubble permet d'ajouter votre propre HTML à toutes les pages d'une app depuis l'onglet Settings. intoCHAT s'appuie là-dessus : une balise script ajoute une bulle de chat dans le coin de chaque page. L'agent répond à partir de ce que vous lui fournissez, comme vos pages publiques, vos documents d'aide et vos questions-réponses, et le dit quand il ne sait pas. La bulle reste fixée dans un coin, au-dessus de la page, séparée de vos éléments et workflows Bubble.
Installer intoCHAT sur Bubble
Créez et entraînez votre agent
Inscrivez-vous sur intoCHAT, créez un agent et ajoutez des connaissances dans l'onglet Knowledge : les pages publiques de votre app, des documents d'aide, ou du texte et des questions-réponses. Les pages derrière une connexion ne peuvent pas être explorées : importez ou collez plutôt ce contenu.
Copiez la balise script
Ouvrez l'onglet Share et copiez le code sous Bubble Chat. Il contient déjà l'identifiant de votre agent.
Ouvrez les réglages d'en-tête et de body
Dans l'éditeur Bubble, ouvrez l'onglet Settings, allez dans SEO / metatags et repérez la section des en-têtes et du body personnalisés.
Collez-la dans le champ body
Collez le script dans le champ body, pas dans le champ d'en-tête. Le code placé là est ajouté au body de chaque page de votre app.
Déployez et vérifiez
Déployez votre app en live et ouvrez-la dans un navigateur. La bulle de chat apparaît dans le coin inférieur, avec les couleurs et la position définies dans l'onglet Appearance.
Le code à coller dans Bubble
<script src="https://www.intochat.ai/api/embed.js" data-chatbot-id="YOUR_AGENT_ID"></script>Utilisez le champ body, pas le champ d'en-tête. Le script ajoute la bulle de chat au body de la page dès qu'il s'exécute : il doit donc se charger dans le body.
Ce que fait l'agent dans votre app Bubble
Appelle l'API de votre app
Les actions API personnalisées permettent à l'agent d'appeler un endpoint HTTP pendant le chat, avec un bearer token, une clé API ou des en-têtes personnalisés. Vous choisissez les champs de la réponse que le modèle voit.
Exécute des fonctions sur votre page
Les actions côté client exécutent des fonctions JavaScript que vous enregistrez sur la page du visiteur, pour que l'agent déclenche ce que votre page sait déjà faire.
Apprend de votre documentation
Importez des fichiers PDF, Word ou Markdown, ajoutez des pages d'aide par URL ou rédigez des questions-réponses. Les réponses des questions-réponses passent avant les autres sources.
S'en tient à vos contenus
Des règles intégrées rattachent les réponses à vos sources et résistent à l'injection de prompt. Quand la réponse ne figure pas dans vos contenus, l'agent dit qu'il ne sait pas au lieu de deviner.
Collecte des leads dans le chat
Un court formulaire dans la conversation demande un e-mail ou un numéro de téléphone, selon les règles que vous fixez. Chaque nouveau lead vous est envoyé par e-mail, ainsi qu'à cinq collègues au maximum.
Reprend le style de votre app
Réglez les couleurs de la bulle et de l'en-tête, l'avatar, l'icône et la position du bouton, ou importez votre logo et vos couleurs à partir de l'adresse de votre site.
Questions fréquentes
intoCHAT ralentit-il mon app Bubble ?
Le script est un fichier unique qui se charge dans le body de la page. La fenêtre de chat tourne dans son propre iframe servi par intoCHAT : son code reste séparé des éléments et des workflows de votre app.
Pourquoi la bulle de chat n'apparaît-elle pas dans mon app Bubble ?
Vérifiez que le script se trouve dans le champ body et non dans le champ d'en-tête, car il a besoin que le body de la page existe au moment où il s'exécute. Si vous regardez l'app en live, vérifiez que vous avez déployé la modification et que l'identifiant de l'agent correspond à celui de l'onglet Share.
Faut-il un plugin Bubble pour intoCHAT ?
Non. intoCHAT s'installe avec une balise script dans le champ body personnalisé de Bubble : il n'y a aucun plugin à installer ni à mettre à jour. Les couleurs, la position, le message d'accueil et les connaissances se gèrent entièrement dans intoCHAT.
Puis-je afficher le chat dans une page plutôt qu'en bulle ?
Oui. Ajoutez un élément HTML à la page et collez le code iframe de l'onglet Share : le chat s'affiche à la taille et à l'endroit que vous choisissez. Sur une même page, utilisez soit l'iframe, soit le script de la bulle, pas les deux, pour que les visiteurs ne voient pas deux chats.
Dois-je modifier mon app Bubble quand je change l'agent ?
Non. Le script ne contient que l'identifiant de votre agent. Les couleurs, la position, le message d'accueil, les questions suggérées et les connaissances sont chargés depuis intoCHAT à chaque ouverture de page : vos modifications apparaissent sans nouveau déploiement.
À quoi ressemble le chat sur mobile ?
Sur les écrans de 768 pixels de large ou moins, le chat s'ouvre en plein écran et la page ne défile plus tant qu'il est ouvert. Quand l'utilisateur le ferme, il retrouve l'endroit de la page où il était.
Voyez-le répondre à partir de votre site
Collez l’adresse de votre site et discutez avec un agent créé à partir de vos pages. Cela prend environ une minute.
Créer votre agent gratuitementOffre gratuite, sans carte bancaire.