Cómo implementar la gestión del consentimiento de cookies (Consent Mode v2) de forma gratuita

¿Necesito implementar la gestión del consentimiento de cookies?

Si su sitio web es visitado por usuarios del Área Económica Europea o del Reino Unido, debe obtener su consentimiento no solo para recopilar sus datos sino también para almacenar cookies en sus navegadores. El consentimiento aplica no solo a las cookies utilizadas por su sitio sino también a las cookies de terceros – como Google Analytics.

¿Cuál es el requisito para obtener consentimientos de cookies?

En 2019, el Tribunal de Justicia de la Unión Europea dictaminó que la información sobre el uso de cookies (opt-out) no es suficiente, y los editores deben obtener el consentimiento del usuario (opt-in) antes de que el sitio almacene datos en forma de cookies en su computadora.

En 2020, la Junta Europea de Protección de Datos confirmó esta posición emitiendo las recomendaciones apropiadas. Desde entonces, las populares “barras de cookies” comenzaron a ser reemplazadas por pop-ups más grandes que contienen más botones – para la aceptación, rechazo o configuración detallada del consentimiento.

El 22 de octubre de 2022, el Parlamento Europeo y el Consejo de la UE emitieron una regulación (“Acta de Servicios Digitales”) imponiendo nuevas obligaciones a las plataformas de internet más grandes. En consecuencia, con la entrada en vigor del acto, el 6 de marzo de 2024, Google comenzó a aplicar el uso del Consent Mode en los editores de sitios web que utilizan sus servicios (incluidos Analytics, Maps, reCAPTCHA, AdSense, AdMob e incluso Fonts). No cumplir con esta obligación significa limitar el acceso de los editores a datos analíticos necesarios para el targeting y la personalización.

¿Qué es el Consent Mode v2?

Consent Mode es una tecnología de Google que permite a los editores pasar información sobre consentimientos de cookies obtenidos de los usuarios finales a Google. El sitio web solicita el consentimiento del usuario, y su decisión se pasa a Google, de modo que herramientas como Analytics, Map o AdSense no utilicen cookies ilegalmente.
El consentimiento puede darse para todas las categorías de cookies, solo para las seleccionadas, o no darse en absoluto (rechazo).

Consent Mode v2 es la última versión de este mecanismo, asegurando la conformidad con GDPR, CCPA y TCF. Introduce dos consentimientos adicionales, en comparación con la v1 – para compartir datos de usuario con fines publicitarios y para la personalización de anuncios.

Los editores de sitios web que muestran anuncios de Google (usando AdSense, AdMob o AdManager) además deben usar plataformas de gestión de consentimiento (CMP) de la lista de proveedores certificados por Google.

¿Cuáles son las formas de implementar la gestión del consentimiento de cookies?

Desde un punto de vista técnico, hay varias soluciones diferentes para implementar el mecanismo de obtención de consentimientos de cookies – dependiendo de la escala y complejidad de su sitio:

A. Plugin local

Si utiliza una solución SaaS (por ejemplo, WIX, Shoper) o tiene un sitio relativamente simple basado en WordPress, es suficiente con instalar y configurar el plugin apropiado. Para WordPress, esto podría ser GDPR Cookie Compliance o Complianz – GDPR/CCPA Cookie Consent.

B. Plataforma de Gestión del Consentimiento

Se recomienda el uso de una plataforma de gestión delconsentimiento dedicada, pero implica costos. Algunas CMP ofrecen opciones gratuitas, pero están severamente limitadas. El límite es el número total de subpáginas en el sitio o el número mensual de vistas. Las opciones gratuitas tampoco incluyen todas las características ofrecidas por las plataformas.

Aquí está cómo se ve el plan “Gratis” para tres proveedores populares:

• CookieYes – hasta 25,000 vistas por mes; escaneo de hasta 100 subpáginas; no incluye el bloqueo automático de cookies recién detectadas, configuración de colores de banner personalizados
• CookieBot – hasta 50 subpáginas; no incluye multilingüismo, expiración del consentimiento después de más de 1 mes, configuración de colores de banner personalizados
• Cookie-Script – hasta 20,000 vistas por mes; escaneo de hasta 10 subpáginas; no incluye configuración de colores de banner personalizados.

Las suscripciones comerciales cuestan no menos de $10 por mes por dominio.
Si tiene varios dominios – incluso dentro de un solo sitio web (versiones de idioma), debe comprar una suscripción separada para cada uno de ellos.

C. Piwik PRO

Nuestra propuesta (descrita en detalle a continuación) se basa en el uso de dos funciones del excelente paquete analítico Piwik PRO – Consent Manager y Tag Manager. Permite la implementación de la gestión del consentimiento de cookies (incluido Consent Mode v2) en hasta 10 sitios web, con un número ilimitado de dominios por sitio web.

Hay un límite de 500,000 acciones por mes, pero si no utiliza Piwik PRO Analytics, las únicas acciones que se contarán son aquellas relacionadas con el banner de consentimiento – visualizaciones, clics y decisiones tomadas.

Piwik PRO, hasta ahora, no está en la lista de CMP certificadas por Google. Pero si no muestra anuncios de Google en su sitio, no tiene que preocuparse por esto. De lo contrario – vea el punto B anterior.

D. Solución personalizada

Mientras que las plataformas de gestión del consentimiento permiten diversas integraciones (desde plugins hasta API), los operadores de sitios web más complejos y extensos pueden optar por tener un control total sobre los consentimientos implementando su propio software.

Guía para implementar la gestión del consentimiento de cookies de forma gratuita (Piwik PRO)

Piwik PRO es una excelente herramienta para análisis web, una gran alternativa a Google Analytics.
Pero no tiene que usar la analítica de Piwik para gestionar los consentimientos de cookies a través de ella. Todavía puede usar Google Analytics.

En esta guía, asumimos que está utilizando GA4, pero no utilizando Google Tag Manager. Si usa GTM, consulte aquí.

1. Verifique las cookies de su sitio

Puede verificar qué cookies envía su sitio a los navegadores utilizando las Herramientas para Desarrolladores de su navegador.
Lance las herramientas (por ejemplo, usando F12) y vaya a la pestaña “Aplicación”. En el lado izquierdo, en la sección “Memoria”, encuentre “Cookies” y haga clic en la dirección de su sitio.

Alternativamente, también puede usar el Free online Cookie Scanner proporcionado por Piwik. Esta herramienta será útil más tarde para verificar su instalación.

Recuerde verificar no solo la página de inicio sino también diferentes tipos de subpáginas.

2. Cree una cuenta en Piwik PRO

Regístrese aquí, proporcionando su dirección de correo electrónico, la URL del primer sitio en el que planea implementar consentimientos y el nombre de la cuenta. Basado en el nombre de la cuenta, se creará para usted un subdominio dedicado, donde su panel de usuario será accesible – por ejemplo, myaccount.piwik.pro.

3. Instale el código de Piwik en su sitio

Al seleccionar “Menu” > “Administration” en la esquina superior izquierda, mostrará una lista de sitios configurados.

Seleccione su sitio, y luego en el lado derecho haga clic en “Installation”. Verá varios métodos de instalación – incluyendo “Install manually”, después de seleccionar el cual verá el código que debe insertar en su sitio justo debajo de la etiqueta de apertura “<body>”.

4. Cambia el código de seguimiento de Google Analytics utilizado hasta ahora

Si estás utilizando Google Analytics 4, lo más probable es que el siguiente código esté en la sección “head” de tu sitio:

<script async src="https://www.googletagmanager.com/gtag/js?id=IDENTIFICADOR"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'IDENTIFICADOR');
</script>

Cámbialo por el siguiente, que incluye la negación predeterminada para almacenar cualquier cookie:

<script async src="https://www.googletagmanager.com/gtag/js?id=IDENTIFICADOR"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
gtag('consent', 'default', {
  'ad_user_data': 'denied',
  'ad_personalization': 'denied',
  'ad_storage': 'denied',
  'analytics_storage': 'denied',
  'region': ["AT", "BE", "BG", "HR", "CY", "CZ", "DK", "EE", "FI", "FR", "DE", "GR", "HU", "IS", "IE", "IT", "LV", "LI", "LT", "LU", "MT", "NL", "NO", "PL", "PT", "RO", "SK", "SI", "ES", "SE", "UK", "CH", "BR"],
  'wait_for_update': 1000
});
gtag('js', new Date());
gtag('config', 'IDENTIFICADOR');
</script>

Alternativamente, puedes mover este código a Piwik Tag Manager, pero entonces necesitas recordar establecer el orden de las etiquetas (ver punto 10 abajo).
Hazlo de la siguiente manera:

“Menu” > “Tag Manager” > “Tags” > “Add a tag”
Tag name: “Google Analytics 4”
Tag type: “Async tag” > “Custom code (async)”
“Next”
en el siguiente paso:
Tag code: here you paste the above code
Consent type: “No consent is required”
Tag triggers: “Choose existing trigger” > “All page Views”
“Add”

5. Crea dos nuevos desencadenantes

“Menu” > “Tag Manager” > “Triggers” > “Add a trigger”
Trigger name: “Window Loaded”
Trigger type: “Page view”
“Next”

Load this tag right after the browser: “Loaded all page elements (page load)”
“Add”

“Menu” > “Tag Manager” > “Triggers” > “Add a trigger”
Trigger name: “Decision Made”
Trigger type: “Data layer event”
“Next”

Event name: “contains”, “stg.consentDecisionMade”
Event conditions: “On all events”
“Add”

6. Crea una nueva etiqueta con el código de actualización del consentimiento

“Menu” > “Tag Manager” > “Tags” > “Add a tag”
Tag name: “Consent Update”
Tag type: “Async tag” > “Custom code (async)”
“Next”

En el siguiente paso:
Tag code:

<script>
    window.gtag = window.gtag || function(){dataLayer.push(arguments)};
    function googleConsentModeMapping(consents) {
        if ({{ Consents }}) {
            var consObj = {};
            Object.keys(consents).forEach(function(consent) {
                consObj[consent] = ({{ Consents }}.current_state[consents[consent]] === 1) ? 'granted' : 'denied';
            });
            gtag('consent', 'update', consObj);
        }
    }
    googleConsentModeMapping({
        "ad_storage": "remarketing",
        "ad_user_data": "remarketing",
        "ad_personalization": "remarketing",
        "analytics_storage": "analytics"
    });
</script>

Consent type: “No consent is required”
Tag triggers: “Choose existing trigger” > “Window Loaded” and “Decision Made”
“Add”

7. Decide si utilizarás las analíticas de Piwik PRO

Si deseas usar Piwik PRO Analytics (recomendado), no necesitas hacer nada más.
Solo recuerda que cada evento registrado (vista de página, desplazamiento, clic en enlace, etc.) contará para el límite de acción previamente mencionado de la cuenta gratuita (500,000 por mes).

Si no deseas usar Piwik PRO Analytics, realiza las siguientes dos acciones:

Desactiva la etiqueta de Piwik PRO:
“Menu” > “Tag Manager” > “Tags” > “Piwik PRO” > “Active” -> “Inactive”

Agrega una nueva etiqueta con código vacío que activará el banner de consentimiento en el sitio:

“Menu” > “Tag Manager” > “Tags” > “Add a tag”
Tag name: “Analytics Event”
Tag type: “Async tag” > “Custom code (async)”
“Next”
en el siguiente paso:
Tag code:

<script></script>

Consent type: “Analytics”
Tag triggers: “Choose existing trigger” > “All page Views”
“Add”

8. Configura el banner de consentimiento y personaliza su apariencia

“Menu” > “Consent Manager” > “Settings”
Aquí definirás, entre otras cosas, los idiomas en los que se mostrará el banner de consentimiento.
El idioma del banner se mostrará automáticamente en el idioma del navegador del usuario. Sugiero dejar el inglés establecido como predeterminado además del español. Se mostrará a todos los usuarios que utilicen navegadores en idiomas distintos al español.
Si sabes que los usuarios de tu sitio web hablan otros idiomas, agrégalos también.

“Menu” > “Consent Manager” > “Forms” > “Consent forms”
Aquí configurarás el diseño, los colores y las fuentes, así como editarás contenidos y enlaces (por ejemplo, a la página de Política de Privacidad).

Además del banner de consentimiento, también formatearás aquí la apariencia de la barra de recordatorio. Esta barra se mostrará si el usuario continúa usando el sitio sin tomar una decisión sobre las cookies.

Según el registro de cambios de Piwik PRO, a partir de la versión 6.0.1, es posible ocultar el pie de página con el logo “Powered by Piwik PRO”.
Sin embargo, no pude encontrar esta configuración en el panel, y lo hago usando la siguiente línea añadida al CSS de mi sitio:

#ppms_cm_footer {display:none !important}

9. Usa el código que permite a los usuarios editar los consentimientos

“Menu” > “Consent Manager” > “Forms” > “Privacy policy”
Aquí encontrarás el código que puedes pegar en tu sitio, por ejemplo, bajo la Política de Privacidad.
Permitirá a los usuarios editar los consentimientos otorgados y, si es necesario, crear solicitudes relacionadas con la privacidad. Los encontrarás más tarde en la sección “Menu” > “Consent Manager” > “Requests from visitors”.

10. Establece el orden de las etiquetas (opcionalmente)

Si no insertaste directamente el código de seguimiento de GA4 en el sitio, sino como una etiqueta (ver punto 4), establece el orden de ejecución de las etiquetas:
“Menu” > “Tag Manager” > “Settings” > “Tag priority”.
Mueve todas las etiquetas de “Available tags” a “Prioritized tags” y arrastra la etiqueta “Google Analytics 4” al principio.

No olvides hacer clic en “Guardar”.

11. Publica los cambios en Tag Manager

Todos los cambios que has realizado en Tag Manager (desencadenantes introducidos, etiquetas, orden establecido) se guardan como un “borrador”.
Para activarlos, debes publicarlos haciendo clic en el botón “Publish” ubicado en la esquina superior derecha de Tag Manager
“Menu” > “Tag Manager” -> “Publish”.

12. Verifica el correcto funcionamiento de la gestión de consentimientos

De manera similar, como en el punto 1 – utiliza el Escáner de Cookies en línea gratuito o las Herramientas para Desarrolladores de tu navegador para comprobar (mejor en una ventana de incógnito):

• si antes de otorgar el consentimiento y después de su denegación, el sitio no almacena cookies, excepto las necesarias (es decir, aquellas del Gestor de Consentimiento o cookies de sesión)
• si después de otorgar el consentimiento, aparecen las cookies esperadas (por ejemplo, Google Analytics).

De la manera descrita, también puedes implementar la gestión de cookies para otros sitios de terceros – por ejemplo, Facebook, Hotjar.

Implementación básica vs. avanzada

Al configurar etiquetas, la ruta de “atajo” es tentadora – crear una etiqueta con el código de seguimiento de Google Analytics, activada en caso de consentimiento para cookies analíticas. Esto se conoce como implementación básica.
Aunque desde un punto de vista legal esta solución es correcta (Google Analytics no guardará cookies sin consentimiento porque simplemente no funcionará), los datos analíticos estarán fuertemente distorsionados.
Si el código de seguimiento de GA se activa solo después de obtener el consentimiento, no se recopilarán datos absolutamente de ninguna visita donde no se haya dado el consentimiento.

En las instrucciones anteriores, apliqué la implementación avanzada, en la cual el código de seguimiento se activa inmediatamente, pero por defecto bloquea el almacenamiento de cookies. Por lo tanto, incluso si no se da el consentimiento para el uso de cookies, se enviarán señales anónimas a Google Analytics. Basándose en tales señales, utilizando el modelado de comportamiento, Google Analytics podrá estimar el número de usuarios y visitas cercano a la realidad.

Fuentes: Cómo configurar el modo de consentimiento en sitios web (Google for Developers)
Google consent mode v2 integration (Piwik PRO Help Center)
Detailed Guide of The Google Consent Mode v2 Integration For Piwik Pro Customers (Dumb Data)

Sobre el Autor

Robert Koch – diseñador de aplicaciones SaaS con experiencia y consultor de optimización de negocios a través de la automatización. Un ávido cervecero casero y quesero en su tiempo libre.