Era molto più semplice quando c’era Google Analytics Universal con i suoi customTasks.
Ma le cose cambiano e lui non c’è più.. :D
Comunque ho avuto bisogno di duplicare il tracciamento e mandarlo a due ID di misurazione diversi.
Sì certo una delle possibili soluzioni potrebbe essere quella di duplicare tutti gli eventi e agganciarli al secondo ID. Se non si trattasse di mantenere poi in un secondo momento questa struttura, si potrebbe anche pensare di fare così. Ma ammettiamolo non è molto sostenibile se si guarda al futuro e a possibili integrazioni.
Quindi come fare?
Possiamo mettere a punto un trucco per inoltrare una copia dei beacon GA4 ad un secondo ID di misurazione. Si basa su una tecnica denominata “Monkey Patching”.
Nel caso non lo sapessi “Monkey Patching” si tratta di una tecnica che modificherà/aggiornerà il comportamento della funzione/metodo precedentemente definito in fase di runtime, senza bisogno di modificare il codice originale.
Google Analytics 4, si basa sull’API navigator.sendBeacon del browser per l’invio dei dati e intercetteremo le chiamate a tale API per poter acquisire il corrente GA4 Hits Payloadse inviarne una copia.
Come configurare Google Tag Manager
<script>
(function() {
// Add your secondary measurement ID(s) here
var measurementIds = ["G-ID-DI-TRACCIAMENTO"];
// We should not run this twice, if the sendBeacon has been already modified, abort
if(navigator.sendBeacon && navigator.sendBeacon.toString().indexOf('native code') !== -1){
// Helper Convert QueryString to an Object
var queryString2Object = function queryString2Object(str) {
return (str || document.location.search).replace(/(^\?)/, "").split("&").map(function(n) {
return n = n.split("="),
this[n[0]] = decodeURIComponent(n[1]),
this;
}
.bind({}))[0];
};
// Helper Convert an Object to a QueryString
var Object2QueryString = function Object2QueryString(obj) {
return Object.keys(obj).map(function(key) {
return key + '=' + encodeURIComponent(obj[key]);
}).join('&');
};
try {
// Monkey Patch, sendBeacon
var proxied = window.navigator.sendBeacon;
window.navigator.sendBeacon = function() {
// Make an arguments copy and modify the Measurement ID
var args = Array.prototype.slice.call(arguments);
var _this = this;
if (args && args[0].match(/analytics\.google\.com|google-analytics\.com.*v\=2\&/)) {
var payload = queryString2Object(args[0]);
measurementIds.forEach(function(id){
payload.tid = id;
args[0] = Object2QueryString(payload);
proxied.apply(_this, args);
});
}
return proxied.apply(this, arguments);
}
;
} catch (e) {
// In case something goes wrong, let's apply back the arguments to the original function
return proxied.apply(this, arguments);
}
}
}
)();
</script>
Questo script va inserito in un Tag Custom HTML in tutte le pagina. Nello script ovviamente va cambiato il seguente codice (G-ID-DI-TRACCIAMENTO) con l’id di tracciamento da duplicare.
Poi al tag di configurazione va aggiunta l’impostazione di accendere il tag solo dopo aver acceso il custom HTML indicato qui sopra.
E il gioco è fatto.
Attenzione: Un problema con le funzioni di Monkey Patching è che potrebbero essere modificate da altri script. Quindi, se navigator.sendBeacon è già stata modificata, dobbiamo rinunciare a questa funzionalità.
Se devi configurare il tracciamento del tuo sito di lead generation o ecommerce, contattami attraverso questo modulo.
