Quels attributs mettre sur l'iframe d'un chatbot ?

Au minimum un title qui décrit le contenu, pour les lecteurs d'écran. Selon le besoin : sandbox pour limiter ce que la page intégrée peut faire, allow pour accorder une fonction précise comme le micro, et loading="lazy" si la fenêtre est plus bas dans la page.

Pourquoi l'iframe du chatbot reste vide ?

Plusieurs causes possibles : le service interdit d'être affiché dans un autre site, ou parce que la politique de sécurité du site ne l'autorise pas (directive frame-src). La documentation MDN prévient aussi que l'événement load se déclenche même si le contenu n'a pas chargé : il ne prouve donc pas que la fenêtre fonctionne.

Intégrer un chatbot en iframe : attributs et précautions

Une iframe est un cadre qui affiche, dans une page du site, une page hébergée ailleurs : ici, la page de discussion de l'outil de chatbot. C'est la bonne forme pour une fenêtre de chat fixe dans une page (une page « Posez votre question »), quand l'outil la propose. Pour une bulle flottante sur tout le site, on utilise plutôt le script de l'outil (voir l'intégration d'un widget de chat).

Une iframe bien posée tient en quelques attributs, décrits par la documentation de référence MDN, lue le 15/11/2026.

L'iframe type d'une fenêtre de chat

<iframe
  src="https://fournisseur.exemple/chat/mon-assistant"
  title="Assistant : questions sur nos horaires, tarifs et réservations"
  allow="microphone"
  loading="lazy"
  width="100%"
  height="600">
</iframe>

L'adresse est un exemple. Chaque attribut a une raison d'être.

Attribut	Rôle, d'après MDN	Pour un chat
`title`	Décrire en peu de mots le contenu intégré	Indispensable : sans lui, un utilisateur de lecteur d'écran doit entrer dans le cadre pour savoir ce qu'il contient
`sandbox`	Vide, il applique toutes les restrictions ; chaque mot ajouté en lève une	À utiliser si l'éditeur documente les jetons nécessaires ; n'ajoutez que ceux-là
`allow`	Définit les fonctions accessibles au cadre (micro, caméra…)	`allow="microphone"` seulement si l'outil propose l'entrée vocale
`loading="lazy"`	Retarde le chargement jusqu'à ce que le cadre approche de la zone visible	Utile si la fenêtre est en bas de page ; à éviter si elle est visible dès l'ouverture
`referrerpolicy`	Règle l'information d'origine transmise ; la valeur par défaut est `strict-origin-when-cross-origin`	Gardez la valeur par défaut, sauf demande de l'outil

Sandbox : prudence avec deux jetons

MDN met en garde : quand la page intégrée a la même origine que la page qui l'accueille, combiner allow-scripts et allow-same-origin est « fortement déconseillé », car la page intégrée peut alors retirer elle-même l'attribut sandbox. Pour un outil tiers, MDN considère que ne pas mettre allow-same-origin est le choix le plus sûr par défaut. Une fenêtre de chat peut avoir besoin de scripts et de formulaires : testez avec les seuls jetons que l'éditeur indique, et vérifiez que la conversation fonctionne.

Autre précision de MDN : un cadre « sandboxé » ne peut ni ouvrir de fenêtre surgissante ni changer la page principale, sauf avec allow-popups ou allow-top-navigation. Si l'assistant donne des liens vers les pages du site, vérifiez qu'ils s'ouvrent.

La taille, surtout sur mobile

Attention aux dimensions. L'aide Wix le rappelle à propos de ses éléments HTML intégrés : les codes fournis ont souvent des largeurs et hauteurs en pixels qui rognent le contenu, et un cadre ne s'adapte pas à l'écran même si la page intégrée est adaptable. Elle conseille de remplacer la largeur par 100%.

Sur mobile, vérifiez :

que la fenêtre tient dans la largeur de l'écran ;
que le champ de saisie reste visible quand le clavier s'ouvre ;
que la page ne défile pas dans deux sens à la fois (voir afficher un chatbot sur mobile).

Quand l'iframe reste vide

Trois causes, dans l'ordre où les chercher :

Le service refuse d'être intégré. L'aide Wix note que certains sites interdisent leur affichage dans d'autres plateformes, et que ce blocage ne se contourne pas. L'éditeur doit fournir une adresse prévue pour l'intégration.
La politique de sécurité du site bloque le cadre. Si le site envoie un en-tête Content-Security-Policy, l'adresse de l'outil doit figurer dans la directive frame-src (ou, à défaut, child-src puis default-src, d'après MDN).
Le contenu a échoué sans le dire. MDN prévient que les navigateurs ne déclenchent pas d'événement d'erreur sur une iframe, et que l'événement load se produit même si le contenu n'a pas chargé. Ne vous fiez pas à load pour vérifier que le chat fonctionne : regardez la fenêtre.

Faire dialoguer la page et la fenêtre

Si le site doit transmettre une information à la fenêtre de chat (la langue de la page, par exemple), MDN rappelle que les scripts ne peuvent pas accéder à la plupart des propriétés d'une fenêtre d'une autre origine : la communication passe par window.postMessage(). Utilisez-le seulement si l'outil le documente.

Iframe ou script : le bon choix

Besoin	Forme conseillée
Bulle présente sur toutes les pages	Script de l'outil
Fenêtre fixe dans une page d'aide	Iframe
Outil de site qui n'accepte que du code dans une page (comme le décrit l'aide de Google Sites)	Iframe, ou lien vers la page de l'outil
Site dont on ne peut pas modifier le code	Lien vers la page de l'outil

Pour une définition simple de ce qu'est un widget de discussion, à partager avec un client, la page de Collabor-IA sur le widget de discussion l'explique sans jargon. Le cas de Google Sites est détaillé sur intégrer un chatbot dans Google Sites.