Segue abaixo código alterado, usando um modelo nosso-dominio-teste. Foi incluído ações para onReady, onOpen e onClose, ajustando o posicionamento e tamanho.
<script type="text/javascript"> (function(s, z, c, h, a, t) { s.webchat = s.webchat || function() { (s.webchat.q = s.webchat.q || []).push(arguments); }; t = z.createElement(c), a = z.getElementsByTagName(c)[0]; t.async = 1; t.src = 'https://nosso-dominioteste.widechat.com.br/webchat/v2/webchat.js'; a.parentNode.insertBefore(t, a); s.webchat('cid', '6228b0d429d5a80012f79759'); s.webchat('host', h); })(window, document, 'script', 'https://nosso-dominio-teste.widechat.com.br'); window.addEventListener("message", function(event) { if(event.origin !== 'https://giassi.widechat.com.br') return; },false); window.webchat('onReady', function() { document.getElementById('iframe-sz-chat').style.right='5px'; document.getElementById('iframe-sz-chat').style.width='80px'; }); window.webchat('onOpen', function() { document.getElementById('iframe-sz-chat').style.right='5px'; document.getElementById('iframe-sz-chat').style.width='380px'; }); window.webchat('onClose', function() { document.getElementById('iframe-sz-chat').style.width='80px'; }); </script> |
No script acima, ao carregar, abrir ou fechar, incluímos os tamanhos desejados para melhor adequar a proporção do ícone ao chamar o Wide Chat. Mais detalhes abaixo de como gerar este código e detalhes de configuração.
1. Métodos disponíveis após o carregamento do script
Após o carregamento do script alguns métodos ficarão disponíveis. Para chamar os métodos é só acessar o método na instância webchat('METODO'). Exemplo:
Event | Returns | Triggered |
onReady | SZchat instance | O chat foi carregado corretamente |
beforeOpen | SZchat instance | Antes de abrir o chat |
onOpen | SZchat instance | Ao abrir o chat |
afterOpen | SZchat instance | Após abrir o chat |
beforeClose | SZchat instance | Antes de fechar o chat |
OnClose | SZchat instance | Ao fechar o chat |
afterClose | SZchat instance | Após fechar o chat |
2. Código de acesso
Em canais, é possível pegar o código de ativação Webchat no canal para ser inserido na página/site desejado:
Com o código abaixo, basta colocar no site/página para carregar o chatbot via janela lateral. O script de integração com o site conta com uma API JavaScript na qual é possível definir alguns parâmetros antes da inicialização do chat e também executar alguns métodos após o chat ser carregado, além da escuta de eventos.
Exemplo:
<script type="text/javascript"> (function(s, z, c, h, a, t) { s.webchat = s.webchat || function() { (s.webchat.q = s.webchat.q || []).push(arguments); }; t = z.createElement(c), a = z.getElementsByTagName(c)[0]; t.async = 1; t.src = 'https://intelbras.widechat.com.br/webchat/v2/webchat.js'; a.parentNode.insertBefore(t, a); s.webchat('cid', '5fb286639e603b62ab7988b3'); s.webchat('host', h); s.webchat('button_label','Simulador Wide Chat') })(window, document, 'script', 'https://intelbras.widechat.com.br'); </script> |
Parâmetros disponíveis antes do carregamento do via Script
Os parâmetros devem ser definidos abaixo da chamada no script de integração:
s.webchat('host', h);
Option | Type | Default | Description |
debug | Boolean | false | Exibe informações de debug no console |
locale | String | pt-BR | Linguagem de exibição |
cid | String | null | ID do canal. Obrigatório por script ou por URL |
button_label | String | null | Texto que vai aparecer no balão do lado do botão do chat e que tem prioridade em relação a configuração do texto no canal (Disponível apenas no modo janela) |
fid | String | null | ID do fluxo que o chat será iniciado. Se vazio inicia no fluxo padrão |
z-index | Integer | 2147483640 | Altera a ordem de exibição do elemento na página |
szf_name | String | null | Definir nome do usuário do chat |
szf_email | String | null | Definir email do usuário do chat |
szf_{CAMPO} | String | null | É possível definir qualquer campo adicional usando o prefixo szf_ + nome do campo em minúsculo, ex.: szf_telefon e (Só é permitido utilizar letras e underlines, um campo adicional deve ser criado no Wide Chat com as mesmas características removendo apenas o 's |
Parâmetros disponíveis antes do carregamento do via URL
É possível capturar parâmetros da URL do site antes do inicio do chat. Por exemplo, caso você queira que os dados do usuário sejam preenchidos automaticamente você passaria os parâmetros da URL do site da seguinte forma:
https://wideteam.widechat.com.br/webchat/v2/?cid=610ad097f8a3e80012077799&host
Detalhes sobre a URL apresentada:
• URL de compartilhamento disponibilizada na plataforma: https://wideteam.widechat.com.br/webchat/v2/?cid=610ad097f8a3e80012077799&h ost=https://wideteam.widechat.com.br
• Antes de passar cada variável é inserido o: &
• Passando as variáveis NAME e EMAIL: szf_name=Marcos&[email protected]
Os parâmetros via URL não sobrescrevem os valores definidos por script.
Este artigo foi útil?
Que bom!
Obrigado pelo seu feedback
Desculpe! Não conseguimos ajudar você
Obrigado pelo seu feedback
Feedback enviado
Agradecemos seu esforço e tentaremos corrigir o artigo