Adicionar chat online com o Google Tag Manager

Antes de começar, lembre-se de ter criado uma conta no Zendesk Chat (antigo Zopim). Você pode criar sua conta gratuita ou escolher um dos planos disponíveis aqui: https://www.zendesk.com.br/chat/?from=zp.

Você também pode usar o LiveChat, outra ferramenta de chat com um bom custo, alto poder de customização e gerenciamento de usuários. Você pode criar uma conta aqui: LiveChat | Software de Chat Ao Vivo e de Serviço de Assistência.

Com a conta no Zendesk Chat ou no LiveChat criada, e tendo acesso no Google Tag Manager, acesse a tela principal do Google Tag Manager e clique em Nova Tag.

Configuração da Tag

1. Na tela que abrir, dê um nome para sua nova tag, você pode fazer como na imagem abaixo com o nome "Chat Zopim".
2. Clique no primeiro bloco chamado Configuração da Tag, será aberta uma lista no lado direito com vários tipos de ferramentas que você pode adicionar no seu e-commerce B2B. O Zendesk Chat não está nessa lista, por isso vamos adicioná-lo de modo manual.
3. Selecione o item HTML personalizado como na imagem abaixo:
   
4. Agora você vai precisar copiar o script que o Zendesk Chat gera no site e adicionar esse pedaço de código no seu Google Tag Manager. Para fazer isso, acesse em uma nova janela a sua conta do Zendesk Chat e no menu lateral clique em Configurações e depois em Widget. Ou acesse este link: https://dashboard.zopim.com/?lang=en-us#widget/getting_started
5. Copie este código HTML, acesse novamente o Google Tag Manager e cole no campo HTML personalizado como na imagem a seguir.
6. Estamos quase lá. Antes de finalizar, vamos definir um acionador para esta tag. Role a página um pouco mais para baixo e clique em Acionamento.
7. Na janela que abrir, clique em All Pages. Isso vai fazer com que o chat apareça em todas as páginas do seu e-commerce B2B.

   Caso queira que ele apareça ou não em páginas específicas, você pode clicar no botão "+" no topo superior direito da tela, ir em Configuração do acionador, selecionar o item Alteração de histórico e colocar o link das páginas que deseja configurar.

   Neste momento vamos focar na opção mais simples que é mostrar o chat em todas as páginas.
8. Depois de ter escolhido o acionador All Pages, clique em Salvar no topo da tela. Você será direcionado para a página principal do Google Tag Manager.
9. No topo da página você vai notar que vai ter um botão azul Enviar.

   Para que suas modificações façam efeito você vai ter que enviá-las ao seu e-commerce B2B. Cada alteração que você fizer no Google Tag Manager vai gerar uma versão para você publicar. Isso é algo que você não pode esquecer.

10. Agora, basta clicar em Enviar, dar um nome que desejar para essa alteração e publicar. Pronto.

Agora o gerenciamento do chat vai ser feito todo pelo site do Zendesk Chat. Limpe o cache do seu navegador para ver as modificações na hora.

Importante!
Como estas ferramentas são desenvolvidos por terceiros, nós da Mercos não conseguimos prestar suporte e não nos responsabilizamos por um mal comportamento do e-commerce B2B devido a estas integrações. Por isto recomendamos que integrações mais complexas sejam feitas pelo seu time de TI ou por uma agência especializada.