Como instalar o chat em site Docusaurus

Use este guia para instalar o chat da IAra em um site feito com Docusaurus.

Antes de começar

• Tenha uma caixa de entrada do tipo Site criada na IAra.
• Copie o websiteToken da caixa de entrada.
• Confirme a URL base da sua instalação, por exemplo https://app.digi2b.com.
• Tenha acesso ao repositório do site Docusaurus.

Opção recomendada: componente de cliente

No Docusaurus, uma forma segura de carregar o widget é criar um componente que injeta o SDK no navegador.

Crie o arquivo src/theme/Root.js:

import React, { useEffect } from 'react';

export default function Root({ children }) {
  useEffect(() => {
    window.chatwootSettings = {
      hideMessageBubble: false,
      position: 'right',
      locale: 'pt_BR',
      type: 'standard',
      darkMode: 'auto',
    };

    const baseUrl = 'https://app.digi2b.com';
    const script = document.createElement('script');
    script.src = baseUrl + '/packs/js/sdk.js';
    script.async = true;
    script.onload = () => {
      window.chatwootSDK.run({
        websiteToken: 'SEU_WEBSITE_TOKEN',
        baseUrl,
      });
    };

    document.body.appendChild(script);

    return () => {
      document.body.removeChild(script);
    };
  }, []);

  return <>{children}</>;
}

Observação técnica

Os objetos window.chatwootSettings e window.chatwootSDK podem manter esse nome por compatibilidade com o SDK herdado. Use os nomes exatamente como aparecem no snippet.

Como testar

1. Rode o Docusaurus localmente.
2. Abra uma página pública do site.
3. Confirme se o balão do chat aparece.
4. Envie uma mensagem de teste.
5. Verifique se a conversa chegou na caixa de entrada correta da IAra.

Problemas comuns

• Usar baseUrl diferente do domínio real.
• Copiar token de outra caixa.
• Bloqueio por CSP, cache ou ad blocker.
• Inserir o script em arquivo que não roda no navegador.