Référence de la balise script : attributs et sources de configuration

Le widget peut être entièrement configuré par les attributs de la balise script, sans script en ligne, et donc aussi avec une Content Security Policy stricte. Si vous préférez écrire du JavaScript, définissez les mêmes champs via window.ReactiveChatSettings ou ReactiveChat('boot', …).

Le design, les textes, l’écran d’accueil, les règles et les visites guidées se règlent normalement dans votre compte ; ils proviennent du serveur à l’établissement de la connexion. Les attributs décrits ici définissent ce qui doit s’appliquer par page. Toutes les options de design sont décrites dans Personnalisation.

Quatre sources de configuration et leur ordre de priorité

La source la plus tardive l’emporte ; la fusion est à plat (un champ objet comme brand est remplacé entièrement, sans fusion en profondeur) :

1. Valeurs par défaut du widget
2. Attributs data-rc-* sur la balise du chargeur
3. window.ReactiveChatSettings (défini avant le chargeur)
4. Appels ReactiveChat('boot', {...}) de la file de commandes, dans leur ordre

Les champs inconnus du widget sont écartés ; un attribut mal saisi reste donc silencieusement sans effet.

<script>
  window.ReactiveChatSettings = { locale: 'en', position: 'left' };
</script>
<script src="https://cdn.reactive.chat/loader.js"
        data-rc-site-key="SITE_KEY"
        async></script>

Lecture des valeurs d’attributs

Le nom passe de la notation avec traits d’union au camelCase : data-rc-site-key → siteKey. Le type découle de la valeur par défaut :

• Chaîne – reprise sans modification.
• Booléen – seuls "false" et "0" valent faux ; tout le reste, y compris un attribut vide, vaut vrai.
• Liste – valeurs séparées par des virgules, par ex. "idle,pointer".
• Nombre ou objet – lu comme JSON. Si le JSON est invalide, la valeur par défaut est conservée.

Seule la balise en cours d’exécution est lue (document.currentScript). Intégrez donc le chargeur comme un script classique, sans type="module".

Obligatoire

• data-rc-site-key (chaîne, obligatoire) – la clé de votre projet, disponible dans votre compte sous Projet → Installation. Motif [A-Za-z0-9_-]{8,64}. Si elle est absente ou invalide, rien ne démarre, sans aucun message dans la console.

Connexion et distribution

• data-rc-ws-url (chaîne, facultatif) – adresse de la connexion du chat. Sans indication, elle est déduite de l’emplacement de loader.js (cdn.reactive.chat → wss://ws.reactive.chat/rc_wss/). Obligatoire dès que vous ne chargez pas loader.js depuis cdn.reactive.chat, ainsi que pour les domaines à terminaison en deux parties comme .co.uk. Voir Transport.
• data-rc-cdn-base (chaîne, facultatif) – répertoire de chargement du noyau et des modules. Par défaut : le répertoire de loader.js.
• data-rc-core-url (chaîne, facultatif) – adresse fixe du noyau à la place de core.<hash>.js dans le même répertoire. Uniquement pour les cas particuliers, comme votre propre miroir.
• data-rc-transport (http, facultatif) – force le repli HTTP dès le départ. Fonctionne sur tout élément présent dans le document au démarrage ; autre possibilité : ReactiveChatSettings.transport = 'http'. Aucun effet via boot.
• data-rc-max-retries (nombre, par défaut 2) – nouvelles tentatives si le noyau ne se charge pas (intervalle de 300 ms × numéro de tentative).

Langue, thème, mouvement

• data-rc-locale (chaîne, par défaut auto) – de, en ou pl. auto utilise <html lang>, puis la langue du navigateur, sinon l’anglais. Les autres langues se replient sur l’anglais.
• data-rc-theme (auto | light | dark, par défaut auto) – auto suit le mode clair/sombre de votre page, sinon celui du système.
• data-rc-motion (auto | reduced | full, par défaut auto) – animations ; auto suit prefers-reduced-motion.
• data-rc-strings (objet JSON, par défaut {}) – remplace des textes individuels, par ex. {"a11y.launcher":"Open help"}. Vous gérez sinon les textes dans votre compte (Personnalisation).

Affichage et position

• data-rc-position (right | left, par défaut right) – coin du bouton du chat et de la fenêtre.
• data-rc-offset (JSON, par défaut {"x":20,"y":20}) – distance au bord en pixels, en plus de la zone de sécurité.
• data-rc-z-index (nombre, par défaut 2147483000).
• data-rc-avoid-overlap (booléen, par défaut true) – évite les barres fixes en bas de l’écran (bannières de cookies, barres de panier).
• data-rc-hide-launcher (booléen, par défaut false) – aucune icône de chat ; la fenêtre ne s’ouvre que via vos propres liens ou l’API JavaScript. Les bulles de relance sont alors masquées. S’applique indépendamment du réglage du compte.
• data-rc-auto-open (booléen, par défaut false) – ouvre la fenêtre après le démarrage.
• data-rc-isolation (shadow | iframe, par défaut shadow) – le widget se trouve dans un shadow DOM fermé ; iframe affiche la fenêtre dans un cadre, pour les pages aux styles globaux très agressifs.
• data-rc-brand (objet JSON) – couleur de marque et forme du bouton du chat. Le chargeur y lit immédiatement primary (#rrggbb), onPrimary, radius et launcher.shape (circle, rounded, square, bubble, leaf), launcher.size (44–72) et launcher.size_m ; le noyau vérifie le reste. Le code de votre compte contient déjà ces valeurs ; sans primary valide, le chargeur n’affiche pas de bouton provisoire mais attend la couleur du serveur (aucun changement brusque de couleur, mais un bouton plus tardif). Si l’objet ne contient que ces champs de démarrage, la marque de votre compte s’applique une fois la connexion établie ; avec des champs supplémentaires (par ex. accent), la vôtre s’applique. Détails dans Personnalisation.
• data-rc-logo (objet JSON) – src, placement (launcher, header, both), height, alt.
• data-rc-custom-css (chaîne) – votre propre CSS à l’intérieur du shadow DOM. Voir Personnalisation.

Chargement et comportement

• data-rc-load-triggers (liste, les cinq par défaut) – moment du chargement du noyau : idle (le navigateur est disponible), pointer (souris ou doigt sur le bouton du chat), command (une commande API autre que boot, update, track, identify), frustration (signal de MousePlayer), push. Le premier déclencheur l’emporte.
• data-rc-idle-timeout-ms (nombre, par défaut 3000) – délai pour le déclencheur idle.
• data-rc-consent (auto | granted | denied, par défaut auto) – état du consentement. auto interroge votre plateforme de consentement (IAB TCF v2 via __tcfapi, sinon consented.eu) ; granted/denied le fixe. Voir Intégration de la confidentialité.
• data-rc-dom-spiegel (booléen, par défaut true) – false n’envoie aucun texte de page à l’assistant et désactive « Montrez-moi ».
• data-rc-promo (booléen, par défaut true) – false masque la carte promotionnelle sur cette page.
• data-rc-launcher-selector (sélecteur CSS) – les clics sur les éléments correspondants ouvrent ou ferment la fenêtre. Ne fonctionne qu’une fois le noyau chargé ; pour les liens devant fonctionner immédiatement, utilisez data-rc-open (ci-dessous).
• data-rc-dnd (booléen, par défaut false) – valeur initiale pour « Ne pas déranger ».
• data-rc-session-ttl-ms (nombre, par défaut 1800000) – durée de reprise d’une session MousePlayer.
• data-rc-debug (booléen, par défaut false) – affichage du diagnostic dans la console. Équivalent : localStorage.setItem('rc_debug', '1') dans le navigateur.

Attributs sur les autres éléments de votre page

Ouvrir le chat (fonctionne immédiatement, même avant le chargement du noyau) :

• data-rc-open – sur n’importe quel élément ; un clic ouvre le chat à côté de cet élément. data-rc-open="corner" l’ouvre dans le coin.
• href="#rc-open" ou href="#reactive-chat" – la même chose pour les liens.
• data-rc-anchor="none" – comme corner.
• data-rc-message – texte saisi dans le champ de saisie mais non envoyé (au maximum 200 caractères).
• data-rc-tab – msg, home ou help : l’onglet affiché au premier plan.

En détail : Ouvrir le chat depuis votre propre lien ou bouton.

Texte de confidentialité :

• data-rc-privacy – emplacement réservé à la section sur reactive.chat dans votre politique de confidentialité, avec data-lang, data-heading (2–6) et data-email. État dans data-rc-privacy-state (loading, done, error). Voir Intégration de la confidentialité.

Exclure du texte de page :

• data-rc-private ou, de manière équivalente, data-rc-ignore – ce sous-arbre n’est jamais envoyé à l’assistant comme texte de page et n’est jamais ciblé par « Montrez-moi ».

<aside data-rc-private>
  Internal notes the assistant should not read.
</aside>

Paramètres d’URL

• ?rc_ab=A à E – force une variante d’un test A/B en cours pour les contrôles qualité (voir Personnalisation).

Le widget n’évalue aucun autre paramètre de l’adresse lors du chargement.

Intégration multiple

Si le chargeur figure deux fois sur la page (par exemple via un modèle et un gestionnaire de balises), seul le premier ayant une clé de site valide démarre ; le second ne fait rien. Une première balise avec une clé invalide ne bloque pas une seconde correcte.

Suite : API JavaScript · Événements