Como criar eventos personalizados no HUB
Introdução
Saiba como os eventos personalizados funcionam no Icomm Notifications HUB e como eles podem ser usados para filtrar usuários em envios de campanhas push.
O que são eventos personalizados?
Eventos personalizados são marcos que ocorrem na página do cliente, podem ser eventos propriamente ditos (um usuário clicou em um botão/adicionar um produto ao carrinho) ou marcos que não necessariamente correspondem a uma determinada ação (o usuário permaneceu mais de 1 minuto Na mesma página).
Como os eventos personalizados são enviados para o HUB de Notificações?
Os eventos personalizados devem ser enviados explicitamente por cada cliente, pois o HUB não tem como saber sobre eles.
Para fazer isso, eles devem usar a função fornecida no SDK que é instalado com o script Hub tradicional em todas as páginas:
wpn('evento', 'NOME DO EVENTO');
Onde <<EVENT NAME>> será o nome que você deseja dar ao evento. Deve ser uma palavra e pode conter apenas letras e números.
Como implementar o evento personalizado?
O evento customizado pode ser implementado da forma que o cliente desejar. aqui estão alguns exemplos:
- Inserção direta no código (link)
- Inserção via javascript
- Inserção do GTM
Para todos esses casos, assumimos que o evento que queremos enviar é 'evento de teste'.
Insira diretamente no código (link)
É talvez o método mais direto e visualizado para um programador ou qualquer pessoa com acesso ao código. O código deve ser adicionado em um link <a> conforme mostrado abaixo.
<a href="#" onclick="wpn('event', 'test event');">Clique para enviar o evento</a>
inserir via javascript
Este caso permite modificar o funcionamento de um site já em execução, sem a necessidade de alterar sua estrutura. Suponha que temos o seguinte link:
<a href=”/see-offers” id=”link-offers”>Ver ofertas</a>
Neste caso, o seguinte código JS pode ser adicionado ao site sem modificar a estrutura existente
<tipo de script=”texto/javascript”>
let link = document.getElementById("link de ofertas");
link.addEventListener('click', () => {wpn('event', 'test event');}, {once:true});
</script>
Inserir do GTM
Este caso é apresentado como uma opção para implementar eventos que não requerem intervenção do programador (alguma ajuda pode ser necessária para identificar o link/botão a ser rastreado).
Suponha que tenhamos a mesma estrutura HTML do caso anterior:
<a href=”/see-offers” id=”link-offers”>Ver ofertas</a>
Neste caso, você deve fazer o seguinte:
Identifique o link/botão no qual deseja acionar o evento
Crie o gatilho correspondente no GTM
Crie a tag e associe-a ao gatilho da etapa 2
Identifique o link/botão no qual deseja acionar o evento
No nosso caso, temos o link que é identificado pelo seu ID (deve ser único em todo o HTML). Para o exemplo, queremos o link cujo id = “link-offers”
Crie o gatilho correspondente no GTM
Insira os gatilhos, no menu à direita
Digite o botão Novo/Nuevo no canto superior direito
Dê um nome a ele (no nosso exemplo “Test Event Trigger”) e pressione o lápis que aparece ao passar o mouse sobre a área central da tela mostrada abaixo.
Selecione o evento que deseja rastrear para acionar o evento personalizado. No nosso exemplo Clique (pode ser “Todos os elementos” ou “Apenas links” neste caso)
Configure a trigger para que dispare somente quando o botão que queremos for clicado, configurando: “alguns cliques” e no HTML ID igual drop-down “enlace-ofertas” (isso funciona para nosso HTML como visto no passo 1, pode necessário aplicar outro filtro específico para cada link/evento que deseja acionar).
Veja a seguir como o gatilho deve ser configurado:
Pressione “Salvar” e salve o gatilho
Crie a tag correspondente no GTM
Insira tags no menu à direita.
Pressione New/Nuevo para configurar o tag do evento que queremos acionar.
Dê um nome a ele (no nosso exemplo “Test Event Tag”) e aperte o lápis que aparece ao passar o mouse sobre o primeiro card na área central da tela mostrada abaixo.
Nessa seção, escolha HTML personalizado.
Preencha com o código do evento que deseja acionar, conforme imagem abaixo.
Em seguida, vá para o segundo cartão e pressione o lápis. Selecione o gatilho que criamos na etapa anterior.
Uma vez selecionado, salve a tag.
Ele pode ser testado usando a funcionalidade integrada do GTM e depois publicado (sem publicação, a tag não estará ativa e, portanto, nenhum evento será gerado).
Como usar eventos personalizados para segmentação no HUB de Notificações?
Entre no HUB e vá até o módulo Behaviors no menu Push Notifications. Nesta tela, pressione o botão Criar comportamento para gerar um novo comportamento com base no evento que enviamos anteriormente.
Crie o evento atribuindo-lhe um nome (com o qual posteriormente será identificado no HUB) e selecione as opções a incluir, evento personalizado igual a “evento de teste” (neste caso, deve substituir por << NOME DO EVENTO> > conforme necessário) nos últimos N dias (sugerimos usar entre 7 e 20 dias).
Depois de preencher os dados, salve o evento e vá para a seção de campanhas push.
Selecione o evento criado.
Você pode selecionar mais de um evento e a campanha será enviada a todos os inscritos que atenderem pelo menos um dos comportamentos selecionados.
Se você deseja estabelecer um filtro para segmentar os usuários que realizaram mais de um evento, pode ser criado a partir de comportamentos (aplicando mais de uma regra).
Nota: A análise de comportamento é computacionalmente cara. Caso seja utilizado para campanhas bomb/relâmpago, lembre-se que pode demorar para ser enviado (dependendo de vários fatores como número de campanhas sendo enviadas simultaneamente, complexidade de comportamento, etc).
Atualizado em: 28/06/2023
Obrigado!