Implementar UTMs em links é essencial para rastrear o tráfego do site, mas pode ser desafiador em páginas do Etus Site, especialmente ao usar botões.
Este guia ensinará como fazer isso de forma clara e eficaz, desde a definição das UTMs até a configuração dos botões. Vamos otimizar o rastreamento de dados para uma compreensão mais clara do desempenho do site.
1. Acesse o editor de páginas;
2. Clique no ícone de engrenagem que fica no canto superior direito da tela;
3. Em seguida, clique em “Javascript & CSS”;
4. Clique para “Adicionar” um novo código;
5. Escolha um nome para seu código, selecione a opção “Funcionamento” e adicione no campo de texto todo o código abaixo;
<script>
function URLToArray(url) {
var request = {};
if(url.indexOf(‘?’) !== -1){
var pairs = url.substring(url.indexOf(‘?’) + 1).split(‘&’);
for (var i = 0; i < pairs.length; i++) {
if (!pairs[i]) continue;
var pair = pairs[i].split(‘=’);
request[decodeURIComponent(pair[0])] = decodeURIComponent(pair[1]);
}
}
return request;
}
/* Campos para integração */
function CamposUTM() {
/* Formulários */
const formularios = Array.from(document.querySelectorAll(‘form’));
utm = URLToArray(window.location.href);
formularios.map(formulario => {
/* Controle de get utm_source */
$(formulario).find(‘.gpc_campo’).each(function(i, campo) {
if ($(campo).val() == ‘{utm_source}’) { if (utm[‘utm_source’]) { $(campo).val(utm[‘utm_source’]); } else { $(campo).val(”); } }
if ($(campo).val() == ‘{utm_medium}’) { if (utm[‘utm_medium’]) { $(campo).val(utm[‘utm_medium’]); } else { $(campo).val(”); } }
if ($(campo).val() == ‘{utm_campaign}’) { if (utm[‘utm_campaign’]) { $(campo).val(utm[‘utm_campaign’]); } else { $(campo).val(”); } }
if ($(campo).val() == ‘{utm_term}’) { if (utm[‘utm_term’]) { $(campo).val(utm[‘utm_term’]); } else { $(campo).val(”); } }
if ($(campo).val() == ‘{utm_content}’) { if (utm[‘utm_content’]) { $(campo).val(utm[‘utm_content’]); } else { $(campo).val(”); } }
});
});
/* Botões */
if(Object.entries(utm).length){
let link_usar = ”;
for (var [key, value] of Object.entries(utm)) { if(key.substr(0,3).toLowerCase() == ‘utm’ || key.toLowerCase() == “origem”){ link_usar += key+’=’+value+’&’; } }
if(link_usar.length){ link_usar = link_usar.substr(0,(link_usar.length-1)); }
/* Habilitar para boões expecificos */
const botoes = Array.from(document.querySelectorAll(‘#ID_ELEMENTO’));
botoes.map(link => {
/* Controle de get utm_source */
$(link).find(‘.c’).each(function(i, href) {
let concatenar = ‘?’;
if($(href).attr(‘href’).indexOf(‘?’) !== -1){ concatenar = ‘&’; }
$(href).attr(‘href’,$(href).attr(‘href’)+concatenar+link_usar);
});
});
}
}
CamposUTM();
</script>
6. A única mudança que você precisará fazer no código, é alterar a parte do link onde está escrito #ID_ELEMENTO para a ID do botão. Não adicione espaços e traços.
Em seguida clique em “Salvar”!
