Script tag reference: all attributes and configuration sources

The widget can be set up entirely through attributes on the script tag – without an inline script, and therefore also under a strict Content Security Policy. If you prefer writing JavaScript, set the same fields through window.ReactiveChatSettings or ReactiveChat('boot', …).

Design, texts, start screen, rules and tours are normally set in your account; they come from the server when the connection is established. The attributes here are for what should apply per page. All design options are described under Customisation.

Four configuration sources and their precedence

The later source wins; merging is flat (an object field such as brand is replaced as a whole, not deep-merged):

1. Widget defaults
2. data-rc-* attributes on the loader tag
3. window.ReactiveChatSettings (set before the loader)
4. ReactiveChat('boot', {...}) calls from the queue, in their order

Fields the widget does not know are discarded – so a mistyped attribute silently has no effect.

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

How attribute values are read

The name is converted from kebab case to camel case: data-rc-site-key → siteKey. The type follows from the default:

• String – taken over unchanged.
• Boolean – only "false" and "0" are false; everything else, including an empty attribute, is true.
• List – comma-separated, e.g. "idle,pointer".
• Number or object – read as JSON. If the JSON is invalid, the default remains.

Only the tag currently being executed is read (document.currentScript). So embed the loader as a classic script, not with type="module".

Required

• data-rc-site-key (string, required) – your project's key, found in your account under Project → Installation. Pattern [A-Za-z0-9_-]{8,64}. If it is missing or invalid, nothing starts – without any message in the console.

Connection and delivery

• data-rc-ws-url (string, optional) – address of the chat connection. If not given, it is derived from the location of loader.js (cdn.reactive.chat → wss://ws.reactive.chat/rc_wss/). Required as soon as you do not load loader.js from cdn.reactive.chat, and for domains with a two-part ending such as .co.uk. See Transport.
• data-rc-cdn-base (string, optional) – directory from which the core and modules are loaded. Default: the directory of loader.js.
• data-rc-core-url (string, optional) – fixed address of the core instead of core.<hash>.js from the same directory. Only for special cases, such as a mirror of your own.
• data-rc-transport (http, optional) – forces the HTTP fallback from the start. Works on any element that is in the document at start-up; alternatively ReactiveChatSettings.transport = 'http'. It has no effect through boot.
• data-rc-max-retries (number, default 2) – retries if the core does not load (interval 300 ms × attempt).

Language, theme, motion

• data-rc-locale (string, default auto) – de, en or pl. auto takes <html lang>, then the browser language, otherwise English. Other languages fall back to English.
• data-rc-theme (auto | light | dark, default auto) – auto follows the light/dark mode of your page, otherwise the system.
• data-rc-motion (auto | reduced | full, default auto) – animations; auto follows prefers-reduced-motion.
• data-rc-strings (JSON object, default {}) – override individual texts, e.g. {"a11y.launcher":"Open help"}. Otherwise you maintain texts in your account (Customisation).

Display and position

• data-rc-position (right | left, default right) – corner of launcher and window.
• data-rc-offset (JSON, default {"x":20,"y":20}) – distance from the edge in pixels, in addition to the safe area.
• data-rc-z-index (number, default 2147483000).
• data-rc-avoid-overlap (boolean, default true) – moves out of the way of fixed bars at the bottom edge (cookie banners, cart bars).
• data-rc-hide-launcher (boolean, default false) – no chat icon; the window opens only through your own links or the JavaScript API. Teasers are then suppressed. Applies regardless of the account setting.
• data-rc-auto-open (boolean, default false) – opens the window after start-up.
• data-rc-isolation (shadow | iframe, default shadow) – the widget lives in a closed shadow DOM; iframe renders the window into a frame, for pages with very aggressive global styles.
• data-rc-brand (JSON object) – brand colour and launcher shape. The loader immediately reads primary (#rrggbb), onPrimary, radius and launcher.shape (circle, rounded, square, bubble, leaf), launcher.size (44–72) and launcher.size_m from it; the core checks the rest. The snippet from your account already carries these values – without a valid primary the loader shows no placeholder button but waits until the colour comes from the server (no colour jump, but a later button). If the object contains only these start fields, the brand from your account applies once the connection is established; with further fields (e.g. accent), yours applies. Details under Customisation.
• data-rc-logo (JSON object) – src, placement (launcher, header, both), height, alt.
• data-rc-custom-css (string) – your own CSS inside the shadow DOM. See Customisation.

Loading and behaviour

• data-rc-load-triggers (list, default all five) – when the core is loaded: idle (the browser is idle), pointer (mouse or finger on the launcher), command (an API command other than boot, update, track, identify), frustration (signal from MousePlayer), push. The first trigger wins.
• data-rc-idle-timeout-ms (number, default 3000) – timeout for the idle trigger.
• data-rc-consent (auto | granted | denied, default auto) – consent state. auto asks your consent platform (IAB TCF v2 via __tcfapi, otherwise consented.eu); granted/denied fixes it. See Privacy integration.
• data-rc-dom-spiegel (boolean, default true) – false sends no page text to the assistant and switches off “Show me”.
• data-rc-promo (boolean, default true) – false hides the promo card on this page.
• data-rc-launcher-selector (CSS selector) – clicks on matching elements toggle the window. Only works once the core has loaded; for links that should work immediately, use data-rc-open (below).
• data-rc-dnd (boolean, default false) – initial value for “Do not disturb”.
• data-rc-session-ttl-ms (number, default 1800000) – how long a MousePlayer session is taken over.
• data-rc-debug (boolean, default false) – diagnostic output in the console. Equivalent: localStorage.setItem('rc_debug', '1') in the browser.

Attributes on other elements of your page

Open the chat (works immediately, even before the core has loaded):

• data-rc-open – on any element; a click opens the chat next to the element. data-rc-open="corner" opens it in the corner.
• href="#rc-open" or href="#reactive-chat" – the same for links.
• data-rc-anchor="none" – like corner.
• data-rc-message – text that is written into the input field but not sent (at most 200 characters).
• data-rc-tab – msg, home or help: which tab is in front.

In detail: Open the chat from your own link or button.

Privacy text:

• data-rc-privacy – placeholder for the section about reactive.chat in your privacy policy, with data-lang, data-heading (2–6) and data-email. Status in data-rc-privacy-state (loading, done, error). See Privacy integration.

Excluding page text:

• data-rc-private or, equivalently, data-rc-ignore – this subtree is never sent to the assistant as page text and never targeted by “Show me”.

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

URL parameters

• ?rc_ab=A to E – forces a variant of a running A/B test for quality checks (see Customisation).

The widget does not evaluate any other parameters in the address when loading.

Embedding more than once

If the loader is on the page twice (for example through a template and a tag manager), only the first one with a valid site key starts; the second does nothing. A first tag with an invalid key does not lock out a correct second one.

Next: JavaScript API · Events