Referência da tag script: todos os atributos e fontes de configuração

O widget pode ser configurado inteiramente por atributos na tag script, sem script inline e, portanto, também com uma Content Security Policy rigorosa. Se preferir escrever JavaScript, defina os mesmos campos por window.ReactiveChatSettings ou ReactiveChat('boot', …).

Design, textos, tela inicial, regras e tours normalmente são definidos na conta; vêm do servidor quando a conexão é estabelecida. Os atributos aqui servem para o que deve valer por página. Todas as opções de design estão descritas em Personalização.

Quatro fontes de configuração e sua precedência

A fonte posterior prevalece; a mesclagem é superficial (um campo de objeto como brand é substituído por inteiro, sem mesclagem profunda):

1. Padrões do widget
2. Atributos data-rc-* na tag do carregador
3. window.ReactiveChatSettings (definido antes do carregador)
4. Chamadas ReactiveChat('boot', {...}) da fila, na sua ordem

Campos que o widget não conhece são descartados; portanto, um atributo digitado incorretamente não tem efeito e não gera aviso.

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

Como os valores dos atributos são lidos

O nome é convertido de kebab case para camel case: data-rc-site-key → siteKey. O tipo é determinado pelo padrão:

• String – mantida sem alterações.
• Booleano – somente "false" e "0" são falsos; todo o restante, inclusive um atributo vazio, é verdadeiro.
• Lista – separada por vírgulas, por exemplo, "idle,pointer".
• Número ou objeto – lido como JSON. Se o JSON for inválido, o padrão é mantido.

Somente a tag em execução é lida (document.currentScript). Portanto, incorpore o carregador como script clássico, sem type="module".

Obrigatório

• data-rc-site-key (string, obrigatório) – a chave do seu projeto, encontrada na conta em Projeto → Instalação. Padrão [A-Za-z0-9_-]{8,64}. Se estiver ausente ou inválida, nada é iniciado, sem qualquer mensagem no console.

Conexão e distribuição

• data-rc-ws-url (string, opcional) – endereço da conexão do chat. Se não for informado, é deduzido do local de loader.js (cdn.reactive.chat → wss://ws.reactive.chat/rc_wss/). Obrigatório quando você não carrega loader.js de cdn.reactive.chat e para domínios com terminação em duas partes, como .co.uk. Veja Transporte.
• data-rc-cdn-base (string, opcional) – diretório do qual o núcleo e os módulos são carregados. Padrão: o diretório de loader.js.
• data-rc-core-url (string, opcional) – endereço fixo do núcleo em vez de core.<hash>.js no mesmo diretório. Somente para casos especiais, como um espelho próprio.
• data-rc-transport (http, opcional) – força o fallback HTTP desde o início. Funciona em qualquer elemento que esteja no documento na inicialização; como alternativa, ReactiveChatSettings.transport = 'http'. Não tem efeito por boot.
• data-rc-max-retries (número, padrão 2) – novas tentativas se o núcleo não carregar (intervalo de 300 ms × tentativa).

Idioma, tema e movimento

• data-rc-locale (string, padrão auto) – de, en ou pl. auto usa <html lang>, depois o idioma do navegador; caso contrário, inglês. Outros idiomas usam inglês como fallback.
• data-rc-theme (auto | light | dark, padrão auto) – auto segue o modo claro/escuro da página; caso contrário, o do sistema.
• data-rc-motion (auto | reduced | full, padrão auto) – animações; auto segue prefers-reduced-motion.
• data-rc-strings (objeto JSON, padrão {}) – substitui textos individuais, por exemplo, {"a11y.launcher":"Open help"}. Fora isso, você mantém os textos na conta (Personalização).

Exibição e posição

• data-rc-position (right | left, padrão right) – canto do botão do chat e da janela.
• data-rc-offset (JSON, padrão {"x":20,"y":20}) – distância da borda em pixels, além da área segura.
• data-rc-z-index (número, padrão 2147483000).
• data-rc-avoid-overlap (booleano, padrão true) – desvia de barras fixas na borda inferior (banners de cookies, barras de carrinho).
• data-rc-hide-launcher (booleano, padrão false) – sem ícone do chat; a janela abre apenas pelos seus próprios links ou pela API JavaScript. As bolhas de aviso são suprimidas nesse caso. Aplica-se independentemente da configuração da conta.
• data-rc-auto-open (booleano, padrão false) – abre a janela após a inicialização.
• data-rc-isolation (shadow | iframe, padrão shadow) – o widget fica em um shadow DOM fechado; iframe renderiza a janela em um quadro, para páginas com estilos globais muito agressivos.
• data-rc-brand (objeto JSON) – cor da marca e forma do botão do chat. O carregador lê imediatamente primary (#rrggbb), onPrimary, radius e launcher.shape (circle, rounded, square, bubble, leaf), launcher.size (44–72) e launcher.size_m; o núcleo verifica o restante. O código de incorporação da conta já contém esses valores; sem um primary válido, o carregador não mostra um botão provisório e espera até a cor vir do servidor (sem mudança brusca de cor, mas com o botão aparecendo mais tarde). Se o objeto contiver apenas esses campos iniciais, a marca da conta será aplicada quando a conexão for estabelecida; com outros campos (por exemplo, accent), a sua será aplicada. Detalhes em Personalização.
• data-rc-logo (objeto JSON) – src, placement (launcher, header, both), height, alt.
• data-rc-custom-css (string) – seu próprio CSS dentro do shadow DOM. Veja Personalização.

Carregamento e comportamento

• data-rc-load-triggers (lista, padrão: todos os cinco) – quando o núcleo é carregado: idle (o navegador está ocioso), pointer (mouse ou dedo sobre o botão do chat), command (um comando da API diferente de boot, update, track, identify), frustration (sinal do MousePlayer), push. O primeiro gatilho prevalece.
• data-rc-idle-timeout-ms (número, padrão 3000) – tempo limite para o gatilho idle.
• data-rc-consent (auto | granted | denied, padrão auto) – estado do consentimento. auto consulta sua plataforma de consentimento (IAB TCF v2 por __tcfapi; caso contrário, consented.eu); granted/denied o fixa. Veja Integração de privacidade.
• data-rc-dom-spiegel (booleano, padrão true) – false não envia texto da página ao assistente e desativa “Mostre-me”.
• data-rc-promo (booleano, padrão true) – false oculta o card promocional nesta página.
• data-rc-launcher-selector (seletor CSS) – cliques nos elementos correspondentes alternam a janela. Só funciona depois que o núcleo é carregado; para links que devem funcionar imediatamente, use data-rc-open (abaixo).
• data-rc-dnd (booleano, padrão false) – valor inicial de “Não perturbe”.
• data-rc-session-ttl-ms (número, padrão 1800000) – por quanto tempo uma sessão do MousePlayer é aproveitada.
• data-rc-debug (booleano, padrão false) – saída de diagnóstico no console. Equivalente: localStorage.setItem('rc_debug', '1') no navegador.

Atributos em outros elementos da sua página

Abrir o chat (funciona imediatamente, mesmo antes de o núcleo carregar):

• data-rc-open – em qualquer elemento; um clique abre o chat ao lado dele. data-rc-open="corner" o abre no canto.
• href="#rc-open" ou href="#reactive-chat" – o mesmo para links.
• data-rc-anchor="none" – como corner.
• data-rc-message – texto inserido no campo de entrada, mas não enviado (no máximo 200 caracteres).
• data-rc-tab – msg, home ou help: qual aba fica em primeiro plano.

Em detalhes: Abrir o chat por um link ou botão próprio.

Texto de privacidade:

• data-rc-privacy – marcador da seção sobre o reactive.chat na sua política de privacidade, com data-lang, data-heading (2–6) e data-email. Estado em data-rc-privacy-state (loading, done, error). Veja Integração de privacidade.

Excluir texto da página:

• data-rc-private ou, de forma equivalente, data-rc-ignore – esta subárvore nunca é enviada ao assistente como texto da página nem usada como alvo de “Mostre-me”.

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

Parâmetros de URL

• ?rc_ab=A até E – força uma variante de um teste A/B em andamento para verificações de qualidade (veja Personalização).

O widget não avalia nenhum outro parâmetro do endereço durante o carregamento.

Incorporar mais de uma vez

Se o carregador estiver duas vezes na página (por exemplo, por um modelo e um gerenciador de tags), somente o primeiro com uma chave do site válida será iniciado; o segundo não fará nada. Uma primeira tag com chave inválida não impede uma segunda correta de funcionar.

A seguir: API JavaScript · Eventos