post
Criando seu Próprio Traqueamento (Track UTM) Permanente com JS + Formulário do Elementor
Publicado em: 22/03/2024 / Atualizado em: 22/03/2024
O código abaixo tem 3 funcionalidades para um traqueamento avançado independente.
- Armazenar parâmetros UTM na primeira visita
- Adicionar parâmetros UTM à URL conforme o usuário navega no site
- Preencher campos de formulário com parâmetros UTM após o DOM estar carregado
Isso faz com que você possa manter um rastreamento permanente do seu usuário que acessou uma URL UTM, mas você pode editar para flexibilizar facilmente. Segue código abaixo:
<script> (function() { // Função para capturar e armazenar os parâmetros UTM na sessionStorage function storeUTMParams() { var utmParams = {}; var hasUTMParams = false; new URLSearchParams(window.location.search).forEach(function(value, key) { if (key.startsWith("utm_")) { utmParams[key] = value; hasUTMParams = true; } }); // Se parâmetros UTM foram encontrados e ainda não estão armazenados, armazená-los na sessionStorage if (hasUTMParams) { sessionStorage.setItem('utmParams', JSON.stringify(utmParams)); } } // Função para adicionar os parâmetros UTM à URL da página atual function addUTMParamsToCurrentUrl() { var storedUtmParams = sessionStorage.getItem('utmParams'); if (storedUtmParams) { var utmParams = JSON.parse(storedUtmParams); var urlParams = new URLSearchParams(window.location.search); // Verificar se algum parâmetro UTM já está na URL var shouldUpdateUrl = false; Object.keys(utmParams).forEach(function(key) { if (!urlParams.has(key)) { urlParams.set(key, utmParams[key]); shouldUpdateUrl = true; } }); // Se necessário, atualizar a URL if (shouldUpdateUrl) { var newUrl = window.location.pathname + '?' + urlParams.toString() + window.location.hash; window.history.replaceState({path: newUrl}, '', newUrl); } } } // Função para preencher campos de formulário com os parâmetros UTM function fillFormFieldsWithUTM() { var storedUtmParams = sessionStorage.getItem('utmParams'); if (storedUtmParams) { var utmParams = JSON.parse(storedUtmParams); Object.keys(utmParams).forEach(function(key) { var formField = document.querySelector('input[name="form_fields[' + key + ']"]'); if (formField) { formField.value = utmParams[key]; } }); } } // Armazenar parâmetros UTM na primeira visita storeUTMParams(); // Adicionar parâmetros UTM à URL conforme o usuário navega no site addUTMParamsToCurrentUrl(); // Preencher campos de formulário com parâmetros UTM após o DOM estar carregado document.addEventListener('DOMContentLoaded', function() { fillFormFieldsWithUTM(); }); })(); </script>
Publicações recomendadas:
Inscreva-se em Nossa News:
Seja notificando sempre que tiver conteúdo novo disponível no meu canal do Youtube ou artigo no meu Blog.
Link Curto para Compartilhamento
Compartilhe esse conteudo nas redes sociais ou por mensagem usando o link curto abaixo. Basta clicar em cima do link para copiar.
bruno.art.br/pb/4792
ID de Referência: 4792
Sugira uma publicação
Envie uma mensagem e sugira um publicação sobre um assunto que tenha dificuldades de resolver.