Introdução
Nessa documentação vamos aprender como integrar a Inngage em um site para habilitar o canal On Site Message.
Esse canal permite exibir mensagens diretamente dentro do site enquanto o usuário navega.
1. Preparação do ambiente
O primeiro passo para integrar o On Site Message é preparar o ambiente Web dentro da plataforma Inngage.
É necessário que já esteja criado um App Web dentro da Inngage.
Esse App Web será responsável por centralizar toda a integração do site com a plataforma.
Durante a criação do App, selecione o canal Web e defina o nome do ambiente.
Após criar o App Web, é importante revisar as configurações iniciais e liberar acesso para os usuários que participarão da operação.
Veja aqui a documentação para liberação de acessos.
Normalmente são incluídos:
-
o time técnico responsável pela integração
-
o time de marketing ou CRM que utilizará o canal
-
os responsáveis pela operação da plataforma.
2. Ativação do On Site Message
Com o ambiente criado, o próximo passo é ativar o canal dentro da plataforma.
Vá até Plataformas → Web Push
Depois clique em "Adicionar URL" do site que será integrado

Ative as funcionalidades de:

Caso o site tenha formulário, pode ativar a flag de "Ativar Captura de Forms".
3. Implementação técnica via Google Tag Manager
A forma mais comum de implementar o On Site Message é utilizando o Google Tag Manager.
Com acesso ao GTM, o time técnico poderá subir o script da Inngage:

Além do script base é necessário implementar as variáveis abaixo:
1. Inngage - app_token: Variável que armazenará o token da aplicação Inngage.
JavaScript
function() { return localStorage.getItem('app_token'); }
2. Inngage - identifier: Variável que contém o identificador do usuário. Este valor será usado para identificar o usuário que clicou no banner.
JavaScript
function() { return localStorage.getItem('identifier'); }
3. Inngage - registration: Variável que contém o registro do usuário. Se o identificador não estiver disponível, o valor desta variável será usado para identificação.
JavaScript
function() { return localStorage.getItem('registration'); }
4. Inngage - URL: Variável que deve conter a URL do serviço Inngage. Esta variável será usada para construir a URL de requisição.

URL: https://api.inngage.com.br/v1/pixelTracking/index.php
4. Validação da integração
Depois que o script estiver configurado no GTM, é hora de validar a integração.
A primeira etapa é utilizar o modo Preview do Google Tag Manager.
Esse modo permite simular a navegação no site e verificar se as tags estão sendo disparadas corretamente.
Durante esse teste é importante observar:
-
se o script da Inngage está carregando no site
-
se as tags estão disparando corretamente
-
se não existem erros no console do navegador.
Dentro do seu navegador:
- Clique com o botão direito
- Selecione Inspecionar
- Ao abrir o console selecione "Local storage", e busque pelo seu site
- Após isso, copie o valor no campo "identifier"
- Depois na plataforma da Inngage vá em "Todo Público" e cole esse identificador
- Depois no site, navegue e veja se as tags de eventos - se houver como add to cart, begin checkout, serão disparadas na plataforma da Inngage
5. Publicação e Go Live
Depois que os testes forem concluídos com sucesso e as tags forem disparadas, o container do Google Tag Manager pode ser publicado.
Com a publicação realizada, o script da Inngage passa a rodar em produção no site e começa a capturar os usuários.
A partir desse momento, o canal On Site Message já estará pronto para uso.