Crear una plantilla del modo de consentimiento

Si usas una solución para gestionar el consentimiento en sitios que utilizan Google Tag Manager (GTM), te recomendamos encarecidamente crear una plantilla que admita el modo de consentimiento de Google. Estas plantillas permiten a los usuarios adoptar el modo de consentimiento e integrarlo en su solución de consentimiento sin necesidad de escribir código, lo que ahorra mucho tiempo y esfuerzo.

Las plantillas del modo de consentimiento permiten crear etiquetas que definan el estado de consentimiento predeterminado y comuniquen a Google Tag Manager las opciones de consentimiento de los visitantes. Esto permite que las etiquetas de Google y de terceros que admiten el modo de consentimiento funcionen correctamente.

Los creadores de plantillas pueden implementar plantillas de modo de consentimiento para uso interno o publicarlas en la galería de plantillas comunitarias para que estén disponibles públicamente. Los proveedores de la plataforma de gestión del consentimiento (CMP) que ofrecen plantillas de modo de consentimiento tienen la oportunidad de aparecer en nuestra documentación del modo de consentimiento y de que el selector de la galería de plantillas incluya sus plantillas.

En esta página se muestran los estados y los tipos de consentimiento, y se indica cómo usarlos con las APIs del modo de consentimiento. En la última sección se muestra un ejemplo de cómo usar las APIs para crear una plantilla de Tag Manager. Si es la primera vez que utilizas el modo de consentimiento o plantillas de Tag Manager, consulta los siguientes artículos para obtener información general:

• Modo de consentimiento
• Guía de inicio rápido sobre plantillas personalizadas
• Gestionar la configuración del consentimiento

Nota: La plataforma de gestión del consentimiento (CMP) suele ser una solución de gestión del consentimiento que proporciona un proveedor. La abreviatura CMP que se utiliza en esta página hace referencia tanto a soluciones internas como de terceros.

Estado del consentimiento y tipos de consentimiento

Las etiquetas de Google y de terceros adaptan su comportamiento de almacenamiento en función del estado del consentimiento granted o denied. Pueden incluir comprobaciones de consentimiento para cualquiera de los siguientes tipos de consentimiento:

Tipo de consentimiento	Descripción
ad_storage	Habilita el almacenamiento (por ejemplo, el de las cookies) relacionado con la publicidad.
analytics_storage	Habilita el almacenamiento (por ejemplo, el de las cookies) relacionado con las analíticas (por ejemplo, la duración de las visitas).
functionality_storage	Habilita el almacenamiento relacionado con las funciones del sitio web o de la aplicación (por ejemplo, la configuración de idioma).
personalization_storage	Habilita el almacenamiento relacionado con la personalización (por ejemplo, las recomendaciones de vídeos).
security_storage	Habilita el almacenamiento relacionado con la seguridad (por ejemplo, las funciones de autenticación, la prevención de fraudes y otros sistemas de protección del usuario).

Nota: Si ofreces opciones de consentimiento que no coinciden con los tipos de consentimiento que se indican aquí, también puedes proporcionar tipos de consentimiento personalizados con tu propia clave.

La plantilla debe ofrecer a los usuarios la posibilidad de configurar un estado de consentimiento predeterminado para cada tipo de consentimiento utilizado en su sitio web. Puede que a los usuarios también les interese definir estados de consentimiento predeterminados para distintas regiones.

Los usuarios de GTM deben activar las etiquetas creadas con tu plantilla en todas las páginas mediante el activador Inicialización del consentimiento. Esto hará que se active antes que el resto de las etiquetas. El código de la plantilla debe definir los estados de consentimiento predeterminados que se hayan configurado justo después de la activación. Luego, la CMP debe notificarlos a los visitantes lo antes posible para que den o denieguen cada tipo de consentimiento aplicable. Cuando un visitante indique su elección, la CMP debe enviar el estado del consentimiento actualizado a través de la API de plantilla correspondiente. El modo de consentimiento rastrea las opciones de consentimiento de los visitantes y las comprobaciones de consentimiento de las etiquetas hacen que el comportamiento de las etiquetas se adapte a ellas.

APIs de consentimiento

Las implementaciones del modo de consentimiento en sitios que utilizan GTM para el etiquetado deben usar las APIs específicas de GTM para gestionar los estados del consentimiento setDefaultConsentState y updateConsentState. También pueden usar la API gtagSet para definir la configuración de ads_data_redaction y url_passthrough según corresponda. Estas APIs solo están disponibles en el entorno aislado de la plantilla de GTM.

El estado de consentimiento predeterminado se debe definir lo antes posible cuando se cargue la página, mediante el evento Inicialización del consentimiento para activar la etiqueta. Las actualizaciones del consentimiento deben indicarse a GTM lo antes posible después de que el usuario dé su consentimiento o cuando su opción de consentimiento anterior se cargue desde las cookies. Hay distintas maneras de activar updateConsentState. En los ejemplos que aparecen más adelante en este artículo se muestran dos posibles opciones.

Nota: gtag (consent, update, etc.) no se debe usar en lugar de updateConsentState porque se pondría en cola después de todos los demás mensajes pendientes, lo que podría hacer que no se procesara hasta que empezara el siguiente evento. Para obtener más información, consulta Cómo se procesa la información de la capa de datos.

Estado de consentimiento predeterminado

Para configurar los ajustes de consentimiento predeterminado, usa la API setDefaultConsentState. En el siguiente ejemplo se muestra el uso de la llamada setDefaultConsentState. Deniega ad_storage de forma predeterminada y da consentimiento para el resto de tipos de almacenamiento. También usa wait_for_update para que haya tiempo de recibir las opciones de los visitantes que envía la CMP.

Nota: No se trata de una llamada estática típica. Los usuarios de la plantilla deben poder configurar los tipos de consentimiento predeterminados para cumplir la política de su organización cuando creen una etiqueta a partir de tu plantilla. Consulta la sección Ejemplo de implementación para saber cómo hacerlo mediante campos de plantilla personalizados.

const setDefaultConsentState = require('setDefaultConsentState');

setDefaultConsentState({
  'ad_storage': 'denied',
  'analytics_storage': 'granted',
  'functionality_storage': 'granted',
  'personalization_storage': 'granted',
  'security_storage': 'granted',
  'wait_for_update': 500
});

Actualizar el estado de consentimiento

Una vez que un visitante del sitio web elige las opciones de consentimiento (normalmente interactuando con un banner de consentimiento), el código de la plantilla actualiza los estados de consentimiento en consecuencia mediante la API updateConsentState.

Nota: La llamada a updateConsentState se debe realizar lo antes posible en las páginas después de la llamada en la que el usuario interactúa con el banner de consentimiento. Si es posible, se recomienda usar el código de entorno aislado de la plantilla en lugar de código externo para leer el consentimiento del usuario directamente desde las cookies que lo almacenan. Al final de este artículo se muestra un ejemplo de cómo hacerlo. Si es necesario realizar solicitudes de red u otras tareas asíncronas antes de llamar a updateConsentState, debes especificar un tiempo de espera de al menos 500 milisegundos en el campo wait_for_update al llamar a setDefaultConsentState. Así, las tareas tendrán tiempo para completarse antes de que se activen las etiquetas de Google. Para obtener más información, consulta Integración con plataformas de gestión del consentimiento asíncronas.

En el siguiente ejemplo se muestra la llamada a updateConsentState de un visitante que ha dado su consentimiento para todos los tipos de almacenamiento. De nuevo, en este ejemplo se usan valores codificados para granted, pero en la práctica estos valores se deben determinar en el tiempo de ejecución con el consentimiento del visitante que ha recogido la CMP.

const updateConsentState = require('updateConsentState');

updateConsentState({
  'ad_storage': 'granted',
  'analytics_storage': 'granted',
  'functionality_storage': 'granted',
  'personalization_storage': 'granted',
  'security_storage': 'granted'
});

Comportamiento específico para regiones concretas

Para definir estados de consentimiento predeterminados que se apliquen a los visitantes de zonas concretas, especifica una región en la plantilla (según el estándar ISO 3166-2). El uso de valores de región permite a los usuarios de plantillas cumplir las normativas regionales sin perder información de los visitantes que no se encuentran en esas regiones. Si no se especifica una región en un comando setDefaultConsentState, el valor se aplica a todas las demás regiones.

Por ejemplo, en el siguiente código, se asigna denied al estado predeterminado de analytics_storage en el caso de los visitantes de España y Alaska, y granted a analytics_storage para todos los demás visitantes:

const setDefaultConsentState = require('setDefaultConsentState');

setDefaultConsentState({
  'analytics_storage': 'denied',
  'region': ['ES', 'US-AK']
});
setDefaultConsentState({
  'analytics_storage': 'granted'
});

Cuanto más específicos son los parámetros, más prioridad tienen

Si se ejecutan dos comandos de consentimiento predeterminados en la misma página con valores para una región y una subregión, se aplicará el comando correspondiente al parámetro más específico. Por ejemplo, si has asignado el valor 'granted' a ad_storage para la región US y el valor 'denied' a ad_storage para la región US-CA, a un visitante de California (CA) se le aplicará la configuración de US-CA, ya que es la más específica.

Región	ad_storage	Comportamiento
US	'granted'	Se aplica a los usuarios de Estados Unidos que no están en California.
US-CA	'denied'	Se aplica a los usuarios de California, en Estados Unidos.
Sin especificar	'granted'	Se usa el valor predeterminado 'granted'. En este ejemplo, se aplica a los usuarios que no se encuentran en Estados Unidos ni en California.

Enviar información de clics en anuncios, IDs de clientes e IDs de sesiones en URLs

Cuando un visitante llega al sitio web de un anunciante tras hacer clic en uno de sus anuncios, la información sobre el anuncio puede añadirse a las URLs de la página de destino como un parámetro de consulta. Para mejorar la precisión de los datos sobre las conversiones, las etiquetas de Google suelen almacenar esta información en cookies propias alojadas en el dominio del anunciante.

Sin embargo, si se asigna el valor denied a ad_storage, las etiquetas de Google no guardarán esa información localmente. Para mejorar la calidad de la medición de los clics en los anuncios, los anunciantes pueden usar parámetros de URL para enviar entre páginas información sobre estos clics mediante una función de envío de datos a través de URL.

Del mismo modo, si se asigna el valor denied a analytics_storage, se puede utilizar la función de envío de datos a través de URL para enviar analíticas basadas en eventos y sesiones (incluidas las conversiones) sin cookies entre páginas.

Para usar la función de envío de datos a través de URL, se deben cumplir las siguientes condiciones:

• En la página hay etiquetas de Google que tienen en cuenta el consentimiento.
• El sitio ha aceptado el uso de la función de envío de datos a través de URL.
• El modo de consentimiento se ha implementado en la página.
• El enlace de salida hace referencia al mismo dominio que el dominio de la página actual.
• En la URL hay un GCLID/DCLID (solo en etiquetas de Floodlight y Google Ads).

Tu plantilla debería permitir al usuario configurar si quiere habilitar esta opción o no. El siguiente código de plantilla se utiliza para asignar el valor true a url_passthrough:

gtagSet('url_passthrough', true);

Nota: Si en tu plantilla añades la opción para definir la función de envío de datos a través de URL, deberás configurarla en la vinculación de conversiones y las etiquetas de Universal Analytics (si se utilizan) para que funcione correctamente. Para obtener más información sobre las prácticas recomendadas al usar la función de envío de datos a través de URL, consulta Gestionar la configuración del consentimiento.

Ocultar datos sobre los anuncios

Si se asigna el valor denied a ad_storage, no se añadirán cookies nuevas con fines publicitarios. Tampoco se utilizarán las cookies de terceros que ya se hayan configurado en google.com y doubleclick.net. Los datos que se envíen a Google seguirán incluyendo la URL de página completa, así como la información sobre los clics en anuncios que contienen los parámetros de URL.

Para ocultar aún más los datos sobre los anuncios cuando se asigna el valor denied a ad_storage, debes asignar el valor true a ads_data_redaction.

gtagSet('ads_data_redaction', true);

Si se asigna el valor true a ads_data_redactiony el valor denied a ad_storage, se ocultarán los identificadores de los clics en anuncios que envían las etiquetas de Google Ads y Floodlight en las solicitudes de red.

ID de desarrollador

Si eres proveedor de una CMP y tienes un ID de desarrollador emitido por Google, utiliza el siguiente método para configurarlo lo antes posible en tu plantilla.

gtagSet('developer_id.<your_developer_id>', true);

Ejemplo de implementación

En este ejemplo se muestra cómo crear una plantilla que lea las cookies de la solución de gestión del consentimiento para obtener las opciones de consentimiento de los visitantes. Así, las opciones estarán disponibles en GTM lo antes posible durante el proceso de carga cuando un visitante las haya seleccionado en una página anterior.

Para seguir este ejemplo, crea un campo en la plantilla que contenga el estado de consentimiento predeterminado. El código de implementación leerá ese campo para definir el estado de consentimiento predeterminado en el tiempo de ejecución. En el comando de actualización, el código intentará leer una cookie configurada por la solución de consentimiento para almacenar las opciones de consentimiento de los visitantes. También debes configurar una retrollamada para updateConsentState para gestionar los casos en los que los visitantes aún tengan que elegir las opciones de consentimiento o decidan cambiar las que ya tienen.

Entre los pasos principales se incluyen los indicados en estas secciones:

• Usar el editor de plantillas para crear la plantilla
• Integrar la plantilla con la solución de consentimiento
• Configuración del usuario de la plantilla

Usar el editor de plantillas para crear la plantilla

1. Inicia sesión en tu cuenta de Google Tag Manager.
2. En el panel de navegación de la izquierda, selecciona Plantillas.
3. En el panel Plantillas de etiquetas, haz clic en Nueva.

Añadir campos

1. Selecciona la pestaña Campos y haz clic en Añadir campo.
2. Selecciona Tabla de parámetros.
3. Cambia el nombre por defaultSettings.
4. Despliega el campo.
5. Actualiza el Nombre visible a Default settings.
6. Haz clic en Añadir columna, selecciona Entrada de texto, cambia el nombre por region y marca la casilla Los valores de las columnas deben ser únicos.
7. Despliega la columna y cambia el nombre visible por Region (leave blank to have consent apply to all regions). La instrucción entre paréntesis es documentación para los usuarios de tu plantilla.
8. Haz clic en Añadir columna, selecciona Entrada de texto y cambia el nombre por granted.
9. Despliega la columna y cambia el nombre visible por Granted Consent Types(comma separated).
10. Haz clic en Añadir columna, selecciona Entrada de texto y cambia el nombre por denied.
11. Despliega la columna y cambia el nombre visible por Denied Consent Types (comma separated).
12. Haz clic en Añadir campo, selecciona Casilla y cambia el nombre del campo por ads_data_redaction.
13. Actualiza el nombre visible a Redact Ads Data.

Añadir código

Copia el código que aparece más abajo y sustituye los parámetros entre corchetes (el nombre de la cookie y el estado de consentimiento actualizado) por los parámetros correspondientes a tu implementación. Una vez actualizado el código, utilízalo para reemplazar el código repetitivo en la pestaña Código de GTM. Guarda la plantilla después de pegar el código.

Nota: Cuando guardes el código por primera vez, se producirá un error de validación que se resolverá cuando añadas los nombres de las cookies más adelante en la pestaña Permisos.

// The first two lines are optional, use if you want to enable logging
const log = require('logToConsole');
log('data =', data);
const setDefaultConsentState = require('setDefaultConsentState');
const updateConsentState = require('updateConsentState');
const getCookieValues = require('getCookieValues');
const callInWindow = require('callInWindow');
const gtagSet = require('gtagSet');
const COOKIE_NAME = '<replace_with_your_cookie_name>';
/**
 * Splits the input string using comma as a delimiter, returning an array of
 * strings
 */
const splitInput = (input) => {
  return input.split(',')
      .map(entry => entry.trim())
      .filter(entry => entry.length !== 0);
};
/**
 * Processes a row of input from the default settings table, returning an object
 * which can be passed as an argument to setDefaultConsentState
 */
const parseCommandData = (settings) => {
  const regions = splitInput(settings['region']);
  const granted = splitInput(settings['granted']);
  const denied = splitInput(settings['denied']);
  const commandData = {};
  if (regions.length > 0) {
    commandData.region = regions;
  }
  granted.forEach(entry => {
    commandData[entry] = 'granted';
  });
  denied.forEach(entry => {
    commandData[entry] = 'denied';
  });
  return commandData;
};
/**
 * Called when consent changes. Assumes that consent object contains keys which
 * directly correspond to Google consent types.
 */
const onUserConsent = (consent) => {
  const consentModeStates = {
    ad_storage: consent['adConsentGranted'] ? 'granted' : 'denied',
    analytics_storage: consent['analyticsConsentGranted'] ? 'granted' :
                                                            'denied',
    functionality_storage: consent['functionalityConsentGranted'] ? 'granted' :
                                                                    'denied',
    personalization_storage:
        consent['personalizationConsentGranted'] ? 'granted' : 'denied',
    security_storage: consent['securityConsentGranted'] ? 'granted' : 'denied',
  };
  updateConsentState(consentModeStates);
};
/**
 * Executes the default command, sets the developer ID, and sets up the consent
 * update callback
 */
const main = (data) => {
  // Set developer ID
  gtagSet('developer_id.<replace_with_your_developer_id>', true);
  // Set default consent state(s)
  data.defaultSettings.forEach(settings => {
    const defaultData = parseCommandData(settings);
    defaultData.wait_for_update = 500;
    setDefaultConsentState(defaultData);
  });
  gtagSet('ads_data_redaction', data.ads_data_redaction);
  // Check if cookie is set and has values that corresopnd to Google consent
  // types. If it does, run onUserConsent().
  const settings = getCookieValues(COOKIE_NAME);
  if (typeof settings !== 'undefined') {
    onUserConsent(settings);
  }
  /**
   * Add event listener to trigger update when consent changes
   *
   * References an external method on the window object which accepts a
   * function as an argument. If you do not have such a method, you will need
   * to create one before continuing. This method should add the function
   * that is passed as an argument as a callback for an event emitted when
   * the user updates their consent. The callback should be called with an
   * object containing fields that correspond to the five built-in Google
   * consent types.
   */
  callInWindow('addConsentListenerExample', onUserConsent);
};
main(data);
data.gtmOnSuccess();

Añadir permisos

A continuación, configura los permisos para acceder al estado de consentimiento y a las cookies.

Para gestionar los estados de consentimiento:

1. Selecciona la pestaña Permisos y haz clic en Accede al estado del consentimiento.
2. Haz clic en Añadir tipo de consentimiento.
3. Haz clic en la casilla y selecciona ad_storage en el menú desplegable.
4. Marca Escritura.
5. Haz clic en Añadir.

Repite los pasos del 2 al 5 y sustituye analytics_storage por ad_storage.

Para terminar, haz clic en Guardar.

Nota: Si los usuarios de plantillas necesitan gestionar tipos de consentimiento además de ad_storage y analytics_storage, añade esos tipos de la misma forma.

Para acceder a las cookies:

1. Selecciona la pestaña Permisos y haz clic en Lee los valores de las cookies.
2. En Específico, escribe los nombres de cada una de las cookies que debe leer tu código para determinar las opciones de consentimiento de los usuarios (un nombre por línea).
3. Haz clic en Guardar.

Pruebas

Consulta Pruebas para obtener información sobre cómo crear pruebas para tu plantilla.

Integrar la plantilla con la solución de consentimiento

El siguiente código muestra un ejemplo de cómo se podría integrar esta plantilla con el código de tu solución de gestión del consentimiento añadiendo un procesador:

// Array of callbacks to be executed when consent changes
const consentListeners = [];

/**
 * Called from GTM template to set callback to be executed when user consent is provided.
 * @param {function} Callback to execute on user consent
 */
window.addConsentListenerExample = (callback) => {
  consentListeners.push(callback);
};

/**
 * Called when user grants/denies consent.
 * @param {Object} Object containing user consent settings.
 */
const onConsentChange = (consent) => {
  consentListeners.forEach((callback) => {
    callback(consent);
  });
};

Configuración del usuario de la plantilla

Debes proporcionar documentación para los usuarios de las plantillas. Con esta plantilla, los usuarios pueden configurar una etiqueta que utilice el activador Inicialización del consentimiento: todas las páginas. En la tabla Configuración, deben introducir la lista de los tipos de consentimiento e indicar para cada uno si quieren aceptarlo o rechazarlo de forma predeterminada. Si la configuración predeterminada varía según la ubicación del usuario, deben crear una fila por cada conjunto de regiones que compartan el mismo estado de consentimiento predeterminado.