Integrando chat widget ao seu site

🛠️ Integração do Chat do Tiflux com Sites e Sistemas

🛠️ Integração do Chat do Tiflux com Sites e Sistemas

📍 Localização: 
📂 Menu > Configurações > Geral > Chat

---

🎯 Introdução

A integração do Chat do Tiflux com sites e sistemas permite oferecer suporte em tempo real diretamente dentro das aplicações web dos clientes. Com a configuração adequada, é possível personalizar o visual do chat, enviar informações pré-preenchidas e adaptar a posição do widget para melhor usabilidade.

---

📚 Sumário

• 🌐 Inserir o Chat do Tiflux no Site

• 🧩 Enviar Parâmetros Extras no Chat

• 🧠 Uso Estratégico de Parâmetros Extras no Chatbot

• 🎯 Personalização da Posição do Chat Widget

• ❓ Perguntas Frequentes (FAQ)

• 🔍 Palavras-chave para IA, indexação e busca

---

🌐 Inserir o Chat do Tiflux no Site

✅ Definição

O Tiflux oferece um script HTML configurável que pode ser integrado a sites ou aplicações web, permitindo a ativação do chat.

🛠️ Passo a Passo

1. Acesse: Configurações > Geral > Chat

2. Configure as cores e ícones conforme a identidade visual desejada.

3. Copie o script HTML gerado.

4. Cole o código no site ou aplicação web.

5. Certifique-se de que o chat esteja ativo no Tiflux.

💡 Boas Práticas

• Configure o chat visualmente antes de copiar o script.

• Garanta que o código seja inserido em todas as páginas relevantes do site.

---

🧩 Enviar Parâmetros Extras no Chat

✅ Definição

É possível enviar informações personalizadas (ex: nome, e-mail, telefone) diretamente do site para o chat do Tiflux.

🛠️ Exemplo de Código com Parâmetros

<script>
  var organization_token = '52ff5d69025353454354354354354353aeb39efd';   
  var name = 'nome';   (já vem com o nome preenchido)
  var mail = '[e-mail]';   (já vem com o email preenchido)
  var phone = '47 999999999'; (já vem com o telefone preenchido)
  var autoSend = 'true'; (já abre o chat pedindo departamentos porque o nome e etc foi preenchido)
  var icon_color = 'null';   
  var init_minimal = 'true';   
  var show_chat_icon = 'true';   
  var script = document.createElement('script');   
  script.type = 'text/javascript';  
  script.src = 'https://public-assets.tiflux.com/chat_widget.js?organization_token='+organization_token+'&name='+name+'&mail='+mail+'&phone='+phone+'&autoSend='+autoSend;   
  document.head.appendChild(script); 
</script>

💡 Boas Práticas

• O preenchimento prévio agiliza o atendimento.

• Informações como nome, e-mail e telefone devem ser passadas com precisão.

---

🧠 Uso Estratégico de Parâmetros Extras no Chatbot

✅ Definição

Os parâmetros extras podem ser utilizados no fluxo "Verificar parâmetros" do chatbot, permitindo respostas personalizadas.

🛠️ Exemplo com Parâmetros Personalizados

<script> 
 var organization_token = 'TOKEN DA ORG';
 var icon_color = 'null';
 var init_minimal = 'true';
 var show_chat_icon = 'false';
 var script = document.createElement('script');
 var extra_params = {param_1: "valor 1", param_2: "valor 2"};
 script.type = 'text/javascript';
 script.src = 'https://public-assets.tiflux.com/chat_widget.js?organization_token='+organization_token;
 document.head.appendChild(script);
</script>

💡 Boas Práticas

• Personalize os fluxos do chatbot usando os parâmetros recebidos.

• Integre o chat a sistemas que já tenham dados do cliente para automatizar o atendimento.

---

🎯 Personalização da Posição do Chat Widget

✅ Definição

Agora é possível ajustar a posição do ícone do chat na tela do usuário.

🛠️ Exemplo de Código

<script> 
 var organization_token = 'TOKEN DA ORG';
 var icon_color = 'null';
 var init_minimal = 'true';
 var show_chat_icon = 'false';
 var script = document.createElement('script');
 var extra_params = {
   margin_bottom: 50,
   margin_right: 50
 };
 script.type = 'text/javascript';
 script.src = 'https://public-assets.tiflux.com/chat_widget.js?organization_token='+organization_token;
 document.head.appendChild(script);
</script>

💡 Boas Práticas

• margin_bottom: ajusta a distância da parte inferior da tela.

• margin_right: ajusta a distância da lateral direita da tela.

• Personalize para garantir que o ícone não sobreponha elementos do site.

---

❓ Perguntas Frequentes (FAQ)

🔹 O chat pode ser inserido em qualquer site? Sim, desde que seja possível adicionar código HTML.

🔹 O que acontece se não enviar parâmetros extras? O chat abrirá normalmente, mas sem informações pré-preenchidas do cliente.

🔹 É possível esconder o ícone do chat? Sim, utilizando o parâmetro show_chat_icon = 'false'.

🔹 O chat pode ser personalizado para diferentes sistemas? Sim, cada sistema pode enviar parâmetros próprios no script.

🔹 O que é autoSend? Quando autoSend está ativado, o chat abre automaticamente solicitando a seleção de departamentos.

---

🔍 Palavras-chave para IA, indexação e busca

integração chat Tiflux,
inserir chat site,
parâmetros extras chat,
personalizar chat widget,
configurar chat Tiflux,
autoSend chat,
chatbot parâmetros Tiflux,
chat com dados pré-preenchidos,
chat personalizado Tiflux,
script chat site

---