Documentation
Tout ce qu'il faut pour brancher Trame en production, du copier-coller aux options avancées. Cette page ne bouge pas : on y vient pour lire et pour copier.
Installation
Collez la balise avant la fermeture du body de votre application front.
<script
src="https://api.trame.dismoi.dev/v1/feedback/widget.js"
data-widget-key="wk_votre_cle_publique"
data-types="bug,feature,chat,rating,sales"
defer></script>
- Cette clé est publique : elle est faite pour être visible dans votre HTML.
- Elle n'est acceptée que depuis le domaine que vous avez déclaré.
- Elle ne sert qu'à déposer un retour, jamais à lire ceux des autres.
Options du widget
Huit attributs data-* sur la balise script. Ni build, ni bundler, ni objet global à configurer.
data-widget-key clé publique du widget (requis)
data-api origine de l'API (défaut : celle du script)
data-position bottom-right | bottom-left | top-right | top-left
data-color couleur du bouton (défaut : #1c205f)
data-scheme light | dark (défaut : mesuré sur votre page)
data-lang fr | en (défaut : détecté sur votre page)
data-types natures proposées (défaut : les quatre premières)
data-capture-requests false pour couper la capture réseau
Choisir les natures de retour
Par défaut le widget propose les quatre premières. data-types restreint la liste et fixe son ordre ; c'est aussi le seul moyen d'afficher la conversation. La première nature est présélectionnée.
data-types="bug,feature" problème et amélioration seuls
data-types="rating" la note seule, présélectionnée
data-types="sales,bug" le contact d'abord, puis le problème
data-types="bug,chat" le problème, puis la conversation
Valeurs : bug | feature | rating | sales | chat
Une valeur inconnue est ignorée ; une liste vide rétablit les quatre premières.
Content Security Policy
Les directives à ajouter si votre application applique une CSP stricte.
script-src https://api.trame.dismoi.dev
connect-src https://api.trame.dismoi.dev
img-src data:
style-src 'unsafe-inline'