Com essa integração é possível abrir, fechar ou esconder o chat, por meio de regras definidas dentro do Google Tag Manager. E com o componente "Evento Webchat" você pode realizar o processo inverso, utilizando o SZ.chat como gatinho para ações dentro do Tag Manager.


Nesse artigo você aprenderá a inserir o script de ativação no site, a abrir o chat automaticamente após 30 segundos de navegação em seu website e como preencher campos adicionais com informações vindas do site. 


Essas são apenas algumas das diversas possibilidades trazidas por esta integração.

1 - Adicionar o script de ativação no site

  • Acessar a aba de Tags;


  • Clicar em novo;



  • Na configuração de Tag, escolha a opção HTML Personalizado; 



  • No campo HTML cole o script de ativação gerado pelo SZ.chat;
  • No acionamento, escolha a opção que mais lhe atenda (Nesse exemplo usaremos a opção: Initialization - All Pages);

  • Atribua um nome para a Tag e clique em Salvar. 



Ao acessar o website, o Webchat será exibido.

2 - Abrir o chat automaticamente após certo tempo do usuário navegando pelo website.


Criar uma variável para controlar a abertura do chat


  • Acessar a aba de Variáveis;


  • No card Variáveis definidas pelo usuário, clique em Novo;



  • Na configuração da variável, escolha a opção Variável da camada de dados;


  • No campo ‘Nome da variável da camada de dados’, escolha o nome da variável que será usada pelo Webchat. (Nesse exemplo usaremos o nome webchatHasOpen);


  • Defina o nome (Nesse exemplo usaremos o nome Chat Foi Aberto);


  • Clique em salvar.


Criar um acionador por tempo

  • Acessar a aba Acionadores;


  • Clique em novo;


  • Na configuração do acionador, escolha a opção Timer;


  • No campo intervalo, defina o tempo para que o acionador seja executado. (Valor em milisegundos);


  • No campo limite, escolha quantas vezes o acionador será executado;


  • Na etapa de condições, escolha a que mais lhe atenda (Nesse exemplo usaremos o filtro de Page Path, ou seja, o acionador será executado em todas a páginas do site);


  • Defina um nome e clique em salvar.


Criar uma tag para abrir o chat

  • Acessar a aba de Tags;


  • Clicar em novo;


  • Na configuração de Tag, escolha a opção HTML Personalizado;


  • No campo HTML adicione o seguinte código:

    <script>
  if ({{Chat Foi Aberto}} !== 'true') {
    window.webchat.chatOpen(); 
  }
</script>

  • Na etapa de acionadores, escolha o acionador de tempo criado anteriormente; 


  • Escolha o nome da Tag e clique em salvar.

Modificar script de ativação para preencher a variável

  • Edite a Tag criada com o script de ativação do Webchat;


  • Adicione o seguinte código, antes do fechamento do script </script>:

    window.webchat('afterOpen', function() {
    window.dataLayer.push({ webchatHasOpen: 'true' });
});
  • Salve as modificações;

Agora ao enviar ou visualizar as modificações, o chat será aberto automaticamente após 30 segundos.

3 - Enviar dados do site para o cadastro do contato

Nessa etapa iremos enviar alguns dados do site para campos adicionais no cadastro do contato 

Enviar o caminho da página em que o chat foi iniciado

Será necessário alterar o script de ativação do Webchat.

  • Abra a Tag que contem o script;


  • Adicione uma nova linha do código, contendo o nome do campo adicional:


Exemplo: para adicionar o valor no campo adicional {{PAGINA_ATUAL}} é necessário adicionar a seguinte linha:

s.webchat('szf_pagina_atual', {{Page Path}});



Obs: Para que o dado seja recebido corretamente pela plataforma, é preciso cadastrar o campo adicional.

  • Salve as modificações


Agora ao enviar ou visualizar as modificações e o chat for iniciado, a informação da página será exibida no campo adicional do contato.