Modo de Consentimiento de Google: Con Google Tag Manager, puedes simplificar el proceso de configuración de etiquetas utilizando plantillas preconfiguradas creadas específicamente para tu configuración de Google Tag Manager.
En la galería de Google Tag Manager puedes elegir entre un amplio abanico de plantillas que puedes añadir con facilidad a tu instalación.
⏰ ¿Tienes poco tiempo? Pasa directamente a Cómo empezar
Google Tag Manager es una potente herramienta que se utiliza para gestionar eficazmente los códigos de seguimiento de sitios web, denominados etiquetas de Google Tag Manager. Pero, ¿qué es Google Tag Manager y cómo puedes utilizarlo en tu beneficio?
Google Tag Manager es una herramienta gratuita de Google. Las etiquetas de Google Tag Manager son segmentos de código que sirven para varios fines, como recopilar datos y facilitar la comunicación entre tu sitio web o aplicación y las plataformas externas de análisis y marketing.
Google Tag Manager se utiliza sobre todo para simplificar y centralizar la gestión de estas etiquetas en tu sitio web o aplicación. Elimina la necesidad de aplicar el código manualmente, por lo que agiliza el proceso y reduce el riesgo de errores. Es una herramienta versátil que te ayuda a gestionar y mostrar etiquetas con mayor eficacia.
En concreto, esta guía explica cómo integrar el Modo de Consentimiento de Google con la plantilla de la Privacy Controls and Cookie Solution de iubenda. No obstante, si prefieres configurar el Modo de Consentimiento de Google sin utilizar la plantilla, puedes seguir esta guía.
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.
Con la plantilla de Google Tag Manager, puedes automatizar las siguientes tareas:
Primero, tienes que crear una cuenta en Google Tag Manager y configurar un contenedor.
A continuación, deberás pegar el segmento de Google Tag Manager en la sección <head> de tu sitio web.
Finalmente, llegarás al panel de Google Tag Manager.
En el panel de control, haz clic en Añadir una nueva etiqueta.
A continuación, haz clic en el área de configuración de etiquetas, selecciona “Descubre más tipos de etiquetas en la Galería de Plantillas de la Comunidad”, haz clic en el icono de la lupa y busca: iubenda
Selecciona “Privacy Controls and Cookie Solution de iubenda” y haz clic en “Añadir al espacio de trabajo” para añadirlo a tu instalación de Google Tag Manager.
Antes de configurar la plantilla, tienes que importarla. Te explicamos cómo:
Una vez de vuelta en el dashboard, haz clic en Añadir una nueva etiqueta.
A continuación, haz clic en el área de configuración de etiquetas, desplázate hasta la sección Personalizado y haz clic en Privacy Controls and Cookie Solution de iubenda para añadirla a tu instalación de Google Tag Manager.
Cuando hayas añadido la plantilla, llegarás a la página de configuración de etiquetas.
Aquí tendrás que:
Los valores predeterminados se configuran como Denegados
para garantizar la mejor protección de la privacidad de tus usuarios.
Recomendamos actuar con extrema cautela al modificar dichos parámetros para garantizar que se ajustan a las mejores prácticas para obtener el consentimiento del usuario mediante una acción positiva.
Para obtener más información sobre los tipos de consentimiento, puedes consultar la documentación oficial de Google aquí.
ad_storage
se indique como denegado
(con fines de segmentación y publicidad). Puede utilizarse para enviar estadísticas basadas en eventos y sesiones (incluidas las conversiones) sin cookies a través de las páginas. ad_storage
se indique como denegado
Puedes consultar la documentación oficial de Google Tags para obtener más información sobre estos parámetros.
Ahora hay dos opciones principales de autoincrustación para integrar Privacy Controls and Cookie Solution en Google Tag Manager (GTM):
Además, la incrustación manual sigue estando disponible como alternativa.
Cuando la configuración remota está activada, el método utiliza el fragmento unificado. Esta opción te permite gestionar la configuración de Privacy Controls and Cookie Solution de forma remota, es decir, las actualizaciones y cambios realizados en Privacy Controls and Cookie Solution se aplicarán automáticamente a tu sitio web sin necesidad de volver a incluir el fragmento y publicarlo de nuevo en GTM.
embeds.iubenda.com/widgets/[sitecode].js
en el cuadro URL de incrustación de la plantilla GTM. Asegúrate de añadir https://
al principio para incluir la URL completa.
⚠️ Importante:
Como puedes observar, el código que hay que pegar para el fragmento unificado es ligeramente diferente del código incluido en tu página de incrustación de iubenda.
Aquí tienes un ejemplo de las partes que no debes pegar en el cuadro de configuración (tachado):
‹script type="text/javascript"src="//embeds.iubenda.com/widgets/[site-code].
js"></script>
Este método utiliza el fragmento ampliado y se utiliza cuando la configuración remota no está activada. Las actualizaciones de Privacy Controls and Cookie Solution requerirán actualizaciones manuales en GTM cada vez que se realicen cambios en la configuración de Privacy Controls and Cookie Solution.
var _iub = _iub || [];
y dentro de _iub.csConfiguration = {...}
en el cuadro de configuración GTM CS.⚠️ Importante:
Como habrás notado, el código que hay que pegar para el fragmento ampliado es ligeramente diferente del código incluido en tu página de incrustación de iubenda.
Aquí tienes un ejemplo de las partes que no debes pegar en el cuadro de configuración (tachado):
<script type="text/javascript">
var _iub = _iub || [];
_iub.csConfiguration = {}
{
{"ccpaAcknowledgeOnDisplay":true,
"ccpaAcknowledgeOnLoad":true,
"ccpaAppliesToEntireUSA":true,
"consentOnContinuedBrowsing": false,
"countryDetection": true,
"enableCcpa":true,
"gdprAppliesGlobally":false,
"lang":"it",
"perPurposeConsent": true,
"siteId": 2398592.
"whitelabel":false,
"cookiePolicyId": 55062451.
"banner": {
"acceptButtonDisplay": true,
"backgroundColor":"#FF0000",
"closeButtonDisplay":false,
"customizeButtonDisplay": true,
"logo":null,
"position": "float-top-center",
"rejectButtonDisplay": true,
}
}<script>
<script type="text/javascript" src="//cdn.iubenda.com/cs/ccpa/stub.js"></script>
<script type="text/javascript" src="//cdn.iubenda.com/cs/iubenda_cs.js" charset="UTF-8" async></script>
También puedes incrustar manualmente el código de la Privacy Controls and Cookie Solution. Para ello, tienes que seguir el método de incrustación estándar descrito enesta guía.
❗️ Para asegurarte de que este método funciona correctamente, recuerda añadir el parámetro: "googleConsentMode": "template" a la configuración de tu Privacy Controls and Cookie Solution.
Sigue estos pasos para añadirlo correctamente:
En la configuración de Privacy Controls and Cookie Solution, asegúrate de desmarcar la opción “Activar configuración remota”. Esto es esencial para que la incrustación manual funcione correctamente.
Después de desactivar la configuración remota, copia el fragmento actualizado y añade el siguiente parámetro:
"googleConsentMode": "template"
Tu fragmento actualizado con el parámetro añadido debería parecerse a este ejemplo:
<script type="text/javascript">
var _iub = _iub || [];
_iub.csConfiguration = {
"countryDetection": true,
"consentOnContinuedBrowsing": false,
"perPurposeConsent": true,
"lang": "en",
"siteId": 11111111, //use your siteId
"cookiePolicyId": 11111111, //use your cookiePolicyId
"floatingPreferencesButtonDisplay": "bottom-right",
"banner": {
"acceptButtonDisplay": true,
"customizeButtonDisplay": true,
"rejectButtonDisplay": true,
"position": "float-top-center"
"googleConsentMode": "template"
}
};
</script>
<script type="text/javascript" src="//cdn.iubenda.com/cs/iubenda_cs.js" charset="UTF-8" async></script>
Por último, puedes elegir el canal de la Privacy Controls and Cookie Solution (Beta, Actual, Estable).
Opcionalmente, puedes activar una función que establezca valores de consentimiento por defecto leyendo las preferencias del usuario almacenadas en cookies o localStorage.
Esta función es experimental y tiene algunas limitaciones. Utilízalo sólo si entiendes perfectamente cómo funciona para evitar una gestión inadecuada del consentimiento.
Cuando esta opción está activada, la etiqueta comprueba los elementos de almacenamiento específicos para determinar si debe conceder automáticamente el consentimiento. El consentimiento se establece como “concedido” sólo si todos los elementos definidos confirman que el usuario ha optado (o no ha optado por la autoexclusión) para ese fin.
Para configurarlo:
storage.useSiteId = true
.Recuerda que se trata de una función experimental destinada a mejorar la gestión del consentimiento antes de que se muestre el banner de iubenda. Utilízalo con cuidado debido a su carácter experimental y a sus limitaciones actuales.
En esta sección se pueden configurar algunos ajustes avanzados, como la prioridad de activación de etiquetas, la secuenciación de etiquetas y los ajustes avanzados de consentimiento. Ten en cuenta que no es necesario editar estos ajustes para que la plantilla funcione, así que si no estás familiarizado con ellos, puedes ignorarlos.
Después de configurar la etiqueta, tienes que configurar el activador para que la etiqueta se active.
Puedes seleccionar “Inicialización del consentimiento – Todas las páginas” como activador.
Una vez completada la configuración, pulsa el botón Guardar situado en la parte superior derecha de la página. La etiqueta ya está lista para ser publicada.
Desde el dashboard de Google Tag Manager, haz clic en Enviar en la parte superior derecha de la página:
Por último, añade un nombre de versión y una descripción, haz clic en Publicar, ¡y listo! La etiqueta ya está en funcionamiento, perfectamente integrada en nuestra Privacy Controls and Cookie Solution.
Las etiquetas como Google Ads, Analytics, Floodlight y Conversion Linker tienen comprobaciones de consentimiento integradas. Son compatibles de forma nativa con el Modo de Consentimiento de Google.
Esto implica que estas etiquetas poseen un mecanismo que altera su funcionalidad en respuesta al estado de consentimiento del usuario.
Ten en cuenta que no es necesario configurar el consentimiento para este tipo de etiquetas.
Puedes simplemente asignar el activador “Todas las páginas” a las etiquetas que tienen comprobaciones de consentimiento integradas como Google Ads, Google Analytics, Floodlight o Conversion Linker
Ejemplo:
Las etiquetas que participan en el seguimiento pero que no son compatibles con las comprobaciones de consentimiento integradas deben establecerse utilizando comprobaciones de consentimiento adicionales. Por ejemplo, si utilizas una etiqueta HTML personalizada, esta es la función adecuada para ti si quieres liberar una etiqueta después de que se haya prestado el consentimiento.
El siguiente procedimiento es válido para las etiquetas de Google Tag Manager que no admiten de forma nativa el Modo de Consentimiento de Google (por ejemplo, etiquetas HTML personalizadas para incrustar el píxel de Facebook, Hotjar u otros scripts personalizados).
Primer paso: Añade el parámetro "emitGtmEvents":true
al script Privacy Controls and Cookie Solution;
En el siguiente ejemplo, creamos una etiqueta HTML personalizada con un script Hotjar (pero puede ser cualquier otro script como el píxel de Facebook, etc.)
Ejemplo:
A continuación, vamos a configurar el bloqueo previo mediante las comprobaciones de consentimiento adicionales del Modo de Consentimiento de Google
"analytics_storage"
Finalidad | Tipo(s) de consentimiento de Google | Descripción |
---|---|---|
Funcionalidad | functionality_storage | Apoya la funcionalidad del sitio web o de la aplicación, por ejemplo, guardando los ajustes de idioma. |
security_storage | Protege a los usuarios activando funciones de seguridad como la autenticación y la prevención del fraude. | |
Experiencia | personalization_storage | Mejora la experiencia del usuario personalizando funciones, como las recomendaciones de vídeos. |
Medición | analytics_storage | Recoge datos (como cookies) con fines estadísticos, por ejemplo, seguimiento de la duración de la visita. |
Marketing | ad_storage | Almacena datos con fines publicitarios. |
ad_user_data | Permite enviar a Google datos del usuario relacionados con la publicidad. | |
ad_personalization | Permite la publicidad personalizada ajustando los anuncios en función de las preferencias del usuario. |
Solo tienes que crear un evento personalizado con las siguientes propiedades:
Nota: cuando cambian las preferencias del usuario, la Privacy Controls and Cookie Solution envía el evento iubenda_gtm_consent_event
a Google Tag Manager
Así se configura el bloqueo previo para la etiqueta
La explicación de las comprobaciones de consentimiento integradas y adicionales también es válida en este caso. Si habilitas las leyes de Estados Unidos en el configurador de la Privacy Controls and Cookie Solution, el comportamiento por defecto para un usuario de Estados Unidos es que la Solución de Cookies establezca todas las finalidades del Modo de Consentimiento de Google como “concedidas“.
Nota: Si estás en un plan “Gratuito”, lo anterior se produce si desactivas el RGPD y aplicas solamente las leyes de Estados Unidos. Alternativamente, si quieres aplicar el RGPD para los usuarios de la Unión Europea y las leyes de Estados Unidos para los usuarios de este país, necesitarás como mínimo contar con el plan “Advanced”.
Cuando el usuario opta por autoexcluirse de una finalidad específica según las leyes de Estados Unidos, ajustamos la configuración de “ad_storage
” y “analytics_storage
” en consecuencia.
En particular:
‘ad_storage
‘ se concede cuando el usuario no se ha autoexcluido de ninguna de las siguientes finalidades de derechos de privacidad de Estados Unidos o cuando no resulten relevantes (por ejemplo, no se aplican los derechos de privacidad de Estados Unidos):
‘analytics_storage
‘ se establece como concedido cuando el usuario o bien no se ha autoexcluido de la finalidad de Estados Unidos “Venta de mi información personal” (finalidades) o bien cuando no resulten relevantes (por ejemplo, no se aplican los derechos de privacidad de Estados Unidos):
Aplica las leyes de Estados Unidos solamente para los usuarios de Estados Unidos y utiliza todas las funciones de iubenda
Si gestionas un sitio web multilingüe y estás implementando el Modo de Consentimiento de Google con la plantilla de Google Tag Manager de iubenda, es fundamental que garantices que tu banner de consentimiento de cookies se adapte a los distintos idiomas. A continuación te explicamos cómo puedes configurar la plantilla de Google Tag Manager de iubenda para sitios multilingües:
En el primer área de texto relacionado con la configuración de Privacy Controls and Cookie Solution, inserta el JSON del script principal, que también se utilizará como fallback. Sin embargo, es importante eliminar el parámetro “lang” de este script. Este script puede contener los parámetros siteID y
cookiePolicyId.
En el área de texto de configuración del idioma de Privacy Controls and Cookie Solution, inserta el código de idioma inicial y, si es posible, solo el cookiePolicyId que identifica el idioma en la configuración. No incluyas el parámetro "lang" en esta configuración.
Ejemplo visual
A continuación se muestra un ejemplo de cómo se ve la configuración en la interfaz GTM:
Ejemplo de código para copiar
Para la Configuración CS, utiliza este código de ejemplo:
{ "askConsentAtCookiePolicyUpdate": true, "floatingPreferencesButtonDisplay": "bottom-right", "perPurposeConsent": true, "siteId": "your-site-id", // <-- Sustitúyelo por el ID real de tu sitio web "whitelabel":false, "cookiePolicyId": "your-cookie-policy-id", // <-- Sustitúyelo por el ID real de tu política de cookies "emitGtmEvents": true, "banner": { "acceptButtonDisplay": true, "closeButtonRejects": true, "customizeButtonDisplay": true, "retiradaexplícita": true, "listPurposes": true, "position": "float-top-center", "showTitle": false } }
Para la configuración del idioma CS, utiliza este código de ejemplo:
{ "ello": { "cookiePolicyId": "your-cookie-policy-id", // <-- Sustitúyelo por el ID real de tu política de cookies de TI, "emitGtmEvents": true "es": { "cookiePolicyId": "your-cookie-policy-id", // <-- Sustitúyelo por el ID real de tu política de cookies de ES, "emitGtmEvents": true } }
Nota: Puedes copiar y pegar estos ejemplos en las respectivas áreas de texto. Asegúrate de sustituir "your-site-id"
y "your-cookie-policy-id"
por tus valores específicos, asegurándote de eliminar el parámetro lang
.
Cómo funciona:
(
atributolang
en la etiqueta <html>
).