Si quieres simplificar el bloqueo de cookies y rastreadores utilizando Google Tag Manager junto con la función de bloqueo automático, es importante que tengas en cuenta que el código relacionado no se puede cargar directamente a través de Google Tag Manager. Sin embargo, puedes consultar la siguiente guía para agilizar el proceso de bloqueo de cookies con Google Tag Manager.
A continuación, te explicaremos cómo integrar Google Tag Manager con laPrivacy Controls and Cookie Solution de iubenda para la Ley de Privacidad de los Consumidores de California (CCPA), elReglamento General de Protección de Datos (RGPD) y el consentimiento por categoría.
El uso de Google Tag Manager es muy recomendable, ya que simplifica considerablemente la adopción de los requisitos de la Ley de Cookies. Sin embargo, solo es eficaz para los scripts que no sean “de posición”. Los scripts que no son “de posición” son todos aquellos que no visualizan un elemento concreto en un lugar determinado de la página. Es decir, puedes utilizar esta solución para todas las herramientas de estadísticas, pero no para banners de AdSense, vídeos de Youtube, botones sociales o widgets.
Consulta la documentación oficial de Google para obtener más información sobre Google Tag Manager. Dicho esto, ¡empecemos el tutorial!
Para empezar a utilizar Google Tag Manager, tendrás que crear una cuenta gratuita y configurar un contenedor.
Una vez creado el contenedor, podemos pasar a la creación de la etiqueta. La etiqueta representa el script que solo se activará según unas reglas determinadas, en nuestro caso el consentimiento del usuario al uso de cookies.
La etiqueta que crearemos estará relacionada con Google Analytics 4:
Haz clic en la ventana de configuración de etiquetas , como se ve en la imagen siguiente:
Selecciona el tipo de etiqueta Google Analytics: configuración de GA4. A continuación, introduce el ID de medición (por ejemplo, G-A2ABC2ABCD) de tu propiedad Google Analytics 4.
Ahora puedes establecer las reglas para la activación de la etiqueta. Te mostramos cómo 👉
Después de haber rellenado los parámetros anteriores, se deben configurar los activadores (es decir, las reglas que permiten que se activen los scripts):
iubenda_consent_given
o, si has activado la función de consentimiento por categoría en tu Privacy Controls and Cookie Solution, iubenda_consent_given_purpose_1...5
iubenda_preference_not_needed
iubenda_ccpa_opted_out
iubenda_consent_given_purpose_s
, iubenda_consent_given_purpose_sh
, iubenda_consent_given_purpose_adv
e iubenda_consent_given_purpose_sd8
Si has activado el Modo Consentimiento de Google, sáltate este paso y pasa a la instalación.
Haz clic en la sección “Activadores” que aparece a continuación:
Después, haz clic en el signo más de la parte superior derecha para añadir un nuevo activador. Ahora, en la ventana de configuración del activador, selecciona Evento personalizado (nota: asegúrate de NO seleccionar “Todas las páginas” como activador).
Para el nombre del evento introduce el siguiente valor: iubenda_consent_given
. De esta forma, se pondrá en marcha el activador para todos los eventos personalizados etiquetados como consentimiento otorgado (consent_given).
Guarda el activador haciendo clic en Guardar:
Si has activado la función de consentimiento por categoría en tu Privacy Controls and Cookie Solution, en lugar del evento iubenda_consent_given
, tendrás que crear un evento personalizado para cada finalidad que muestres en tu banner/política de cookies (con la excepción de la finalidad “Necesarios”).
Si no tienes claro a qué propósito/categoría pertenecen los servicios que funcionan en tu sitio web, puedes simplemente hacer referencia a los subapartados a los que pertenecen en tu política de cookies de iubenda.
Aquí tienes las 5 finalidades (y los valores de los eventos personalizados):
iubenda_consent_given_purpose_2
)iubenda_consent_given_purpose_3
)iubenda_consent_given_purpose_4
)iubenda_consent_given_purpose_5
)Como Google Analytics forma parte de la categoría “Estadísticas” incluida en la finalidad “Medición”, tendrás que crear un evento personalizado con el siguiente valor: iubenda_consent_given_purpose_4
. De esta forma, se pondrá en marcha el activador para todos los eventos personalizados
etiquetados como consentimiento otorgado finalidad 4 (consent_given_purpose_4).
Para las leyes de privacidad de los estados de Estados Unidos, utiliza los siguientes eventos:
iubenda_consent_given_purpose_s
: vender mi información personaliubenda_consent_given_purpose_sh
: compartir mi información personaliubenda_consent_given_purpose_adv
: tratar mi información personal para publicidad personalizadaiubenda_consent_given_purpose_sd8
: tratar mis datos de localización geográfica precisaCuando hayas terminado, guarda el activador como de costumbre.
Utiliza el mismo procedimiento para crear otro evento personalizado llamado iubenda_preference_not_needed
, que se activará siempre que no se necesite una preferencia (por ejemplo, con los valores gdprApplies:
false, o gdprAppliesGlobally:false
, countryDetection:true
y si el usuario tiene su sede fuera de la Unión Europea):
Si se te resulta de apliación la CCPA y, como en este caso, la etiqueta/servicio se considera una venta, debe desactivarse cuando el usuario opte por la exclusión voluntaria. Para ello, tendrás que crear una excepción llamada iubenda_ccpa_opted_out
.
Antes de crear este evento, tendrás que definir un filtro al respecto. Haz clic en Variables y después en Nueva (junto a Variables definidas por el usuario). Llámala iubenda_ccpa_opted_out
, haz clic en el cuadro Configuración de la variable y elige Variable de capa de datos, utiliza iubenda_ccpa_opted_out
como Nombre de variable de capa de datos y selecciona Versión 2 como Versión de la capa de datos. A continuación, pulsa Guardar.
Ahora que has definido la variable, crea un nuevo activador llamado iubenda_ccpa_opted_out
. En Configuración del activador:
.*
como Nombre del evento y selecciona Utilizar concordancia con expresiones regulares (regex); iubenda_ccpa_opted_out
, y los parámetros equals y true y haz clic en Guardar.
Al final, la etiqueta de configuración de Google Analytics: configuración de GA4 tendrá este aspecto:
Pulsa Guardar para guardar la etiqueta.
No pasa nada por añadir los activadores iubenda_consent_given
y iubenda_consent_given_purpose_4
, incluso aunque no utilices la función de consentimiento por categoría. Configurar ambos activadores ahora te permitirá no editar todas tus etiquetas si decides activar esa función en el futuro.
Al establecer esta regla, Google Tag Manager activará la etiqueta de configuración de GA4 de Google Analytics que hemos creado anteriormente solamente cuando se produzcan verdaderamente estas reglas. En consecuencia, la etiqueta se activará cada vez que Google Tag Manager reciba un evento con los valores iubenda_consent_given
, iubenda_consent_given_purpose_4
o iubenda_preference_not_needed
.
capa de datos
en todos los contenedores, tal y como se explica aquí.Para instalar Google Tag Manager, accede al administrador, copia el código que proporciona Google e insértalo en todas las páginas de tu propio sitio web siguiendo las instrucciones proporcionadas; si utilizas un sistema de gestión de contenido (CMS) que extrae el encabezado de página de un archivo de plantilla de encabezado (por ejemplo, header.php), bastará con pegarlo en ese archivo.
Nota: tendrás que eliminar tu propio código de Google Analytics.
Google Analytics se activará automáticamente por el script de Google Tag Manager solo después de que el usuario/visitante preste su consentimiento al uso de cookies.
Ve a tu dashboard de iubenda > [tu sitio web] > Privacy Controls and Cookie Solution y haz clic en el botón Integrar para llegar a la sección correspondiente:
Una vez allí, recupera el código de tu banner de cookies (si aún no has activado la Privacy Controls and Cookie Solution, solo tienes que hacer clic en Activar, establecer la configuración y después dirigirte a la sección de integración para recuperar el código tal y como se describe).
Ahora, tu código tendrá el siguiente aspecto:
<script type="text/javascript">
var _iub = _iub || [];
_iub.csConfiguration = {
"lang": "en",
"siteId": XXXXXX, //use your siteId
"cookiePolicyId": YYYYYY, //use your cookiePolicyId
"banner": {
"position": "float-top-center",
"acceptButtonDisplay": true,
"customizeButtonDisplay": true
}
};
</script>
<script type="text/javascript" src="//cdn.iubenda.com/cs/iubenda_cs.js" charset="UTF-8" async></script>
Debe editarse de la siguiente manera:
<script type="text/javascript">
var _iub = _iub || [];
_iub.csConfiguration = {
"lang": "en",
"siteId": XXXXXX, //use your siteId
"cookiePolicyId": YYYYYY, //use your cookiePolicyId
"banner": {
"position": "float-top-center",
"acceptButtonDisplay": true,
"customizeButtonDisplay": true
},
"callback": {
onPreferenceExpressedOrNotNeeded: function (preference) {
dataLayer.push({
iubenda_ccpa_opted_out: _iub.cs.api.isCcpaOptedOut(),
});
// preferences parameter may be undefined if both GDPR and LGPD do not apply
// we may need the line below to find USPR preferences instead of relying
// on preferences parameter
var otherPreferences = _iub.cs.api.getPreferences();
if (otherPreferences) {
var usprPreferences = otherPreferences.uspr;
if (usprPreferences) {
for (var purposeName in usprPreferences) {
if (usprPreferences[purposeName]) {
dataLayer.push({
event: 'iubenda_consent_given_purpose_' + purposeName,
});
}
}
}
}
if (!preference) {
dataLayer.push({
event: 'iubenda_preference_not_needed',
});
}
else if (preference.consent === true) {
dataLayer.push({
event: 'iubenda_consent_given',
});
}
else if (preference.consent === false) {
dataLayer.push({
event: 'iubenda_consent_rejected',
});
}
else if (preference.purposes) {
for (var purposeId in preference.purposes) {
if (preference.purposes[purposeId]) {
dataLayer.push({
event: 'iubenda_consent_given_purpose_' + purposeId,
});
}
}
}
}
}
};
</script>
<script type="text/javascript" src="//cdn.iubenda.com/cs/iubenda_cs.js" charset="UTF-8" async></script>
Por ello, hemos añadido una llamada de retorno que, en el momento en que el usuario da su consentimiento, llama al código de Google Tag Manager para desbloquear el evento que hemos configurado para la activación de Google Analytics.
Ahora que hemos adaptado el código para la integración con Google Tag Manager, lo incluiremos en nuestras páginas antes del cierre de la etiqueta BODY
.
Si ya has terminado, pasa directamente a Publicar; de lo contrario, sigue leyendo para ver la Configuración avanzada (estos ajustes te permiten acelerar la activación de las etiquetas, activar etiquetas solo en páginas específicas y establecer varios tipos de seguimiento en la misma página añadiendo parámetros adicionales a la configuración de Google Tag Manager).
En esta sección, utilizaremos “Variables” y “Excepciones de activación” para ser aún más específicos. Google Tag Manager permite crear variables y establecer excepciones en las condiciones de activación de la etiqueta.
Puedes pensar en las excepciones como “activadores de bloqueo”. Por ejemplo, si solo quieres que tu etiqueta de Google Analytics se active en la página del carrito, puedes establecer una excepción a la regla de activación que establezca que la etiqueta no se active en ninguna página que no sea la del carrito de; al establecer esta excepción, se bloquea la activación de la etiqueta en páginas que no sean la del carrito. Del mismo modo, puedes configurar un activador para que solo se active si se cumplen las condiciones relacionadas con una variable concreta.
De este modo, tanto las variables como las excepciones permiten una mayor flexibilidad en la gestión de las etiquetas (puedes leer lo que Google dice sobre las excepciones aquí y sobre las variables aquí).
Como se ha mencionado anteriormente, si solo quieres que la etiqueta de Google Analytics se active en la página del carrito, puedes establecer una excepción a la regla de activación que establezca que la etiqueta no se dispare en ninguna página que no sea la del carrito. Te contamos cómo hacerlo ⬇️”
Crea una variable llamada Page URL (haz clic en “Variables” en el panel izquierdo y después en “Nueva variable”). A continuación, haz clic dentro del cuadro de configuración de variables para elegir el tipo de variable y selecciona URL.
Ahora haz clic en guardar y llama a la variable con un nombre relacionado con la página en la que quieres que se active la etiqueta. En nuestro ejemplo, hemos llamado a la variable “Carrito”.
A continuación, crea el nuevo activador de bloqueo o Excepción que quieras añadir (haz clic en “Activadores” en el panel izquierdo, y luego en “Nuevo”). Intenta ponerle a tu excepción un nombre pertinente. En este ejemplo hemos llamado al nuestro: “NO es carrito”
A continuación, haz clic dentro del cuadro de configuración del activador para elegir el tipo de activador, en este caso “Vista de página”.
Haz clic en Guardar.
Por último, vuelve a tu etiqueta y, además del activador “iubenda consentimiento otorgado”, también tienes que asociar la excepción que acabamos de crear. Puedes hacerlo haciendo clic en el lápiz de la sección “Activación”,
y luego haz clic en el enlace “Añadir excepción” que aparece.
A continuación selecciona la excepción que acabamos de crear, guarda y ¡listo! Ahora la etiqueta solo se activará cuando se obtenga el consentimiento para las cookies (como exige la ley), pero no se activará en páginas que no sean la de tu “Carrito”.
Si quieres hacer un seguimiento de más de un evento en la misma página (por ejemplo, hacer un seguimiento de las visitas de páginas y también del envío de un formulario de compra), tendrás que crear etiquetas adicionales y especificar el tipo de seguimiento variado. Aunque establecer varios tipos de seguimiento es sencillo de hacer en Google Tag Manager, para cumplir la ley debes garantizar que el resto de eventos activadores solo se produzcan después de haber recibido el consentimiento. Te explicamos cómo hacerlo:
Para este ejemplo, supongamos que, además de realizar un seguimiento de las vistas de páginas en Google Analytics (como se establece en la etiqueta que creamos en la primera sección), también te gustaría realizar un seguimiento de las transacciones.
Para ello, tendremos que crear otra etiqueta de Google Analytics, establecer el tipo de seguimiento como “Transacción” y hacer clic en Guardar (puedes ponerle un nombre descriptivo, como “Transacciones de Universal Analytics”).
A continuación, crea una variable de cookie propia (haz clic en “Variables” en el panel izquierdo y añade una nueva variable personalizada)
Pulsa el botón “Guardar” y ponle un nombre como “Cookieiubenda”.
A continuación, crea el nuevo activador que quieras añadir: por ejemplo, “Compra realizada”; tipo “Envío de formulario”.
Si has establecido perPurposeConsent
en true, la variable “Cookieiubenda” no contendrá el valor “consent”:true, sino los valores referidos a las finalidades únicas aceptados (es decir, “1”:true, “2”:true, “3”:true, “4”:true etc). Adapta en consecuencia los pasos sugeridos.
Por último, vuelve a tu etiqueta “Transacción de Universal Analytics” y asocia el activador que acabamos de crear. Puedes hacerlo haciendo clic en la sección “Activación” y seleccionando simplemente el activador “Compra realizada” que acabamos de crear.
Guarda y ¡listo!
Nota: si quieres que el seguimiento de la transacción solo se produzca en una página (por ejemplo, la página del carrito), consulta el tutorial sobre cómo hacerlo en el tutorial de la primera pestaña de esta sección.
Es posible activar las etiquetas con mayor rapidez modificando dos parámetros adicionales en Google Tag Manager como:
Crea una variable de cookie propia (haz clic en “Variables” en el panel izquierdo y añade una nueva variable personalizada)
A continuación, crea un nuevo activador: “Ley de Cookies no aceptada” tipo “Vista de página”. Este nuevo activador permitirá que la presencia de la cookie de iubenda se trate como una excepción:
Por último, vuelve a tu etiqueta y, además del activador “iubenda consentimiento otorgado”, también tienes que asociar la excepción que acabamos de crear. Puedes hacerlo haciendo clic en el lápiz de la sección “Activación”,
y luego haz clic en el enlace “Añadir excepción” que aparece. Ahora selecciona el activador que acabamos de crear y haz clic en guardar.
Cuando pongas en marcha esta configuración avanzada recuerda que si se modificara el cookiePolicyId, la modificación también tendría que aplicarse en la configuración. Para una correcta configuración, no es necesario ni ventajoso incluir código iubenda a través de Google Tag Manager.
Fuente: tagmanageritalia.it/guida-base-gestire-la-cookie-law-di-iubenda-con-google-tag-manager
Si previamente pasaste a la sección avanzada justo después de crear y configurar tu etiqueta y activadores, comprueba que instalas Google Tag Manager en tu propio sitio web e instala el script de iubenda ANTES de continuar con la sección Publicar que aparece a continuación.
Después de haber configurado las reglas, publica el contenedor para que las modificaciones SE ACTIVEN en tu sitio web:
Para ello, haz clic en el botón ENVIAR situado en la parte superior derecha de la página de resumen del contenedor y, a continuación, confirma.
Estos ejemplos pueden reutilizarse para cualquier otro script o función de JavaScript.