LocalStorage Google Tag Manager
Parece ser que Safari está apretando el lazo alrededor de las cookies del navegador con la introducción de ITP 2.1 (Prevención de seguimiento inteligente). Entre otras cosas, ITP 2.1 se encarga de limitar la caducidad de las cookies del cliente a un total de 7 días.
Ello puede provocar que el seguimiento de Google Analytics en un sitio web resulte bastante más difícil para los usuarios que hagan uso de navegadores Safari. Y es que Google Analytics se centra en una cookie del navegador que cuenta por defecto con un límite de 2 años, de tal modo que este máximo de 7 días en el caso de subdominios sin «returning visitors» afecta a la calidad de los datos.
En este texto lo que se pretende es mostrar cómo usar CustomTask con localStorage. Google muestra cómo hacerlo en la documentación del desarrollador. Sin embargo, la cuestión es que Google únicamente muestra cómo reemplazar el almacenamiento de cookies con localStorage en Google Tag Manager pero no como realizarlo. Para ello será necesario seguir las siguientes pautas:
- Cuando se crea un rastreador de Google Analytics, se tendrá que verificar si la ID del cliente persiste en localStorage. Si este es el caso, entonces será necesario su vencimiento.
- Crear el rastreador con el ID de cliente de localStorage. En el caso de que no haya ID de cliente en localStorage, deberás utilizar los mecanismos de creación y almacenamiento de client ID Google Analytics
- En el momento que se active la etiqueta, deberás escribir la ID del cliente en localStorage
Cómo configurar la ID del cliente
Para poder configurar la ID del cliente será necesario contar con dos variables de JavaScript personalizadas. Una de ellas para configurar el ID de cliente y la otra para obtenerlo.
Aquí tenéis el script para usar el localStorage para un clientId persistente
Funcion localStorage – Client ID
En el Administrador de etiquetas de Google será necesario que crees una nueva variable de JavaScript personalizada y pegues el contenido del portapapeles dentro. Posteriormente, tendrás que seguir estas pautas:
- Eliminar el siguiente texto desde el inicio del bloque de código:
var customTask =
- Eliminar el último carácter del bloque de código completo, el cual debería ser un punto y coma
A continuación, se tendrá que modificar el objeto de configuración.
var localStorageCid = {
objectName: 'ga_client_id',
expires: 1000*60*60*24*365*2
};
Si se desea que el nombre del objeto escrito en localStorage sea diferente a ‘ga_client_id’, será necesario que cambies el valor de cadena respectivo. El valor de caducidad es un número en milisegundos que se encarga de indicar el tiempo que debe estar almacenado el objeto.
Suele actualizarse cada vez que se activa una etiqueta con este script customTask. Si se desea que el almacenamiento caduque antes o después de dos años, se deberá cambiar el valor de los vencimientos o fechas de caducidad.
Como traer el Client ID
La segunda variable Custom Javascript para empujar desde el LocalStorage y usar el valor guardado en la cookie de _ga sería
function() {
var objectName = 'ga_client_id';
if (window.localStorage) {
var jsonObj = window.localStorage.getItem(objectName) || '{}';
var obj = JSON.parse(jsonObj);
var now = new Date().getTime();
if (obj.clientId && obj.expires) {
if (now <= obj.expires) {
return obj.clientId;
}
}
}
return;
}
Para terminar hablando sobre localStorage en GTM añade CustomTask a todas las etiquetas de Google Analytics. La forma más sencilla es empleando una variable de configuración de Google Analytics, compilando una CustomTask que incorpore múltiples funciones diferentes.
Desarrollador Web
4 añosExcelente info!! Thx Master!!👏
Wine Labels Manager Production | Escribe en FotoPalabras | SEO Local | Analista Web & CRO
4 añosQue bueno Jose. Me lo guardo y comoparto.
Director de Kubik Experience - Agencia de CRO y Marketing Digital Creador del podcast "Te Falta Selva" Fundador de Akademia, formación de IA aplicada al Marketing digital
4 añosEsto es digno de un tutorial José 👏🏽👏🏽