Customisation

Here you will find everything you can set in reactive.chat: how the widget looks, what it says, when it speaks to visitors and how the AI assistant answers. For each setting you will see where to find it in your account, which values it accepts and, where possible, how to set it in code for individual pages.

How to embed the widget and how the JavaScript interface works as a whole is described in Technical integration. How to use reactive.chat day to day is covered in the product handbook.

Where the settings are

You set almost everything on your project's page: /app/projects/{id}. It has seven tabs:

• Installation – embed snippet, name, domain, colour scheme, default language, availability, guided flow
• Appearance – brand (colours, launcher, style, window, custom CSS), home screen, promo card, note about reactive.chat
• Texts & forms – pre-chat form, own wording, product tours, canned responses
• AI & knowledge – assistant, crawl run, blocked areas, products
• Rules & service – tooltips and timed actions, response and service targets, email notification, transcript by email
• Privacy – consent, withdrawal, deletion, retention
• Archive

On top of that there are separate pages under /app/projects/{id}/…, for example for Smart Answer, memory, versions, test runs, automation and campaigns, as well as the A/B tests under /app/ab.

Changes in your account usually reach your visitors within a minute. The preview on the project page shows the real widget with your entries, even before you save.

In your account or in code?

Your account applies to all pages of your project. In code (attributes on the snippet or ReactiveChat(…) calls) you adjust a single page, such as a campaign page, or set things your account has no field for, such as the position of the launcher.

<script src="https://cdn.reactive.chat/loader.js"
        data-rc-site-key="SITE_KEY"
        data-rc-position="left"
        data-rc-strings='{"input.placeholder":"Your question …"}'
        async></script>

Which one wins when both are set is explained for each setting. As a rule of thumb: texts and theme set in code beat your account. For the brand, the snippet only beats your account if it contains more than the initial colour.

Chapters

1. Colours, font and theme – brand colour, surfaces, contrast protection, light/dark, design assistant, custom CSS, logo in the header
2. The launcher – shape, size, icon, label, display, position, avoiding bars, chat without a launcher
3. Chat window – style, window size, side panel, background, text size, header, phones
4. Texts and languages – language detection, default language, own wording, texts in code
5. The chat's home screen – greeting, logo, tiles, Help tab, promo card
6. Availability, forms and service – opening hours, offline form, pre-chat form, guided flow, transcript by email, attachments
7. Proactive messages – tooltips, timed messages, rules as JSON, bubbles in code, campaigns
8. Product tours and “Show me”
9. A/B tests – test variants of launcher, window and texts (beta)
10. AI assistant – name, tone, topic range, handover, memory, versions, test runs
11. Knowledge and sources – crawl run, blocked areas, files, approvals, improved answers
12. Smart Answer – AI answers below your website's search field
13. Privacy and consent – consent, deletion, retention, cookie banner
14. Team, console and notifications – canned responses, commands, service targets, automation, notifications
15. Plans, beta and setup assistant

Related guides

• Embedding the widget
• Open the chat from your own link or button
• The promo card in the chat
• Embed the privacy text automatically
• Own domain (first-party)
• Technical details

All parts of the documentation at a glance: Documentation.