O tracking.js é o principal item da stack do Synapside Analytics.
Ele é responsavel por capturar eventos em sites e produtos, de forma automática ou manual para eventos personalizados.
Instalação
Para instalar o tracking.js em seu site, adicione o snippet abaixo no HTML — de preferência no <head> — ou através de gerenciadores de tag como o Google Tag Manager (GTM).
<script>
window.sAnalytics_project = 'project_{project_id}';
window.sAnalytics = window.sAnalytics || function () {
(window.sAnalytics.q = window.sAnalytics.q || []).push(arguments);
};
</script>
<script src="https://receiver.analytics.synapside.com/dist/sAnalytics_v1.build.js" async></script>
Substitua project_{project_id} pelo código do seu projeto, disponível no dashboard do Synapside Analytics.
sAnalytics antes mesmo do script carregar. Assim, qualquer chamada feita logo após a instalação é enfileirada e executada automaticamente assim que o SDK inicializar — sem race conditions.
Em ferramentas como GTM, use eventos de Exibição de página como gatilho da TAG.
Eventos automáticos
Após a instalação, o tracking.js passa a capturar os seguintes eventos sem nenhuma configuração adicional:
| Evento | Quando é disparado |
|---|
session_start | Primeira visita da sessão |
pageview | Carregamento de cada página |
click | Clique em elementos <a> e <button> |
form_submit | Envio de qualquer formulário |
Eventos personalizados — track
Use sAnalytics('track', ...) para registrar qualquer ação relevante no seu produto.
<script>
sAnalytics('track', 'nome_do_evento', {
propriedade: 'valor',
outra_propriedade: 'outro_valor'
});
</script>
<script>
sAnalytics('track', 'checkout_iniciado', {
plano: 'pro',
valor: 99.90,
moeda: 'BRL'
});
</script>
Você pode chamar sAnalytics('track', ...) a qualquer momento após a instalação do snippet — antes ou depois do SDK carregar. Os eventos são enfileirados automaticamente.
Identificação de usuários — identify
Use sAnalytics('identify', ...) para associar um usuário identificado (após login, por exemplo) à sessão atual.
<script>
sAnalytics('identify', {
type: 'email',
value: 'usuario@exemplo.com'
});
</script>
| Campo | Tipo | Descrição |
|---|
type | string | Tipo do identificador: email, phone, user_id, etc. |
value | string | Valor do identificador |
data | object | (Opcional) Propriedades adicionais do usuário |
<script>
sAnalytics('identify', {
type: 'email',
value: 'usuario@exemplo.com',
data: {
nome: 'João Silva',
plano: 'pro'
}
});
</script>
O identify vincula todos os eventos futuros (e retroativamente os da sessão atual) ao usuário identificado no dashboard.
Uso no Google Tag Manager
No GTM, cada chamada pode ser configurada em tags separadas:
Tag de instalação — gatilho: Exibição de página - Todas as páginas
<script>
window.sAnalytics_project = 'project_{project_id}';
window.sAnalytics = window.sAnalytics || function (...args) {
(window.sAnalytics.q = window.sAnalytics.q || []).push(args);
};
</script>
<script src="https://receiver.analytics.synapside.com/dist/sAnalytics.build.js" async></script>
<script>
sAnalytics('track', 'meu_evento', { propriedade: 'valor' });
</script>
<script>
sAnalytics('identify', {
type: 'email',
value: '{{variavel_email_usuario}}'
});
</script>
