Tworzenie szablonu trybu uzyskiwania zgody

Ten artykuł jest przeznaczony dla deweloperów, którzy używają rozwiązania do zarządzania zgodą użytkowników w witrynach korzystających z Menedżera tagów Google.

Na tej stronie opisujemy rodzaje zgody w Menedżerze tagów Google i pokazujemy, jak je zintegrować z rozwiązaniem do zarządzania zgodą użytkowników.

Stan zgody użytkownika i rodzaje zgód

Tagi Google i tagi innych usług dostosowują swoje zachowanie dotyczące przechowywania danych na podstawie stanu zgody (granted lub denied). Mogą one zawierać wbudowane mechanizmy weryfikacji zgody dotyczące dowolnego z tych typów zgody:

Tworzenie nowego szablonu zgody

Tryb uzyskiwania zgody śledzi wybory użytkowników dotyczące zgody na przetwarzanie danych, a sprawdzanie zgody tagów zapewnia, że zachowanie tagów jest odpowiednio dostosowywane. Tworząc nowy szablon zgody, postępuj zgodnie ze sprawdzonymi metodami:

• Zamiast gtag consent użyj interfejsów API trybu uzyskiwania zgody Menedżera tagów: setDefaultConsentState i updateConsentState.

• Ustaw domyślne stany zgody natychmiast po uruchomieniu za pomocą reguły Inicjacja zgody – Wszystkie strony.

• Platforma CMP musi jak najszybciej poprosić użytkownika o wyrażenie zgody lub odmowę w przypadku wszystkich odpowiednich typów zgody.

• Gdy użytkownik wybierze opcję zgody, platforma CMP musi przekazać zaktualizowany stan zgody użytkownika.

1. Tworzenie nowego szablonu

W tym podejściu do implementacji jedno pole w szablonie służy do przechowywania domyślnego stanu zgody. Kod implementacji odczytuje to pole, aby ustawić domyślny stan zgody w czasie wykonywania. W przypadku polecenia update kod próbuje odczytać plik cookie ustawiony przez rozwiązanie do uzyskiwania zgody, aby zapisać wybory użytkownika dotyczące zgody. Musisz też skonfigurować wywołanie zwrotne dla updateConsentState, aby obsłużyć przypadek, gdy użytkownik nie wyraził jeszcze zgody lub zdecyduje się ją zmienić.

Aby utworzyć szablon zgody:

1. Zaloguj się na konto Menedżera tagów Google.
2. W panelu nawigacyjnym po lewej stronie kliknij Szablony.
3. W panelu Szablony tagów kliknij Nowy.

Aby ustawić domyślne stany zgody użytkownika:

1. Kliknij kartę Pola, a potem Dodaj pole > Tabela param.
2. Zmień nazwę na defaultSettings.
3. Rozwiń pole.
4. Zmień wyświetlaną nazwę na Default settings.
5. Kliknij Dodaj kolumnę, wybierz Tekst, zmień nazwę na region i zaznacz pole Wymagaj, aby wartości kolumny były unikalne.
6. Rozwiń kolumnę i zmień wyświetlaną nazwę na Region (leave blank to have consent apply to all regions). Wyrażenie w nawiasach jest dokumentacją dla użytkowników szablonu. Dowiedz się więcej o konfigurowaniu domyślnych ustawień zgody użytkownika dla różnych regionów.
7. Kliknij kolejno Dodaj kolumnę, Wejście tekstowe i zmień nazwę na granted.
8. Rozwiń kolumnę i zmień wyświetlaną nazwę na Granted Consent Types (comma separated).
9. Kliknij kolejno Dodaj kolumnę, Dane wejściowe tekstowe i zmień nazwę na denied.
10. Rozwiń kolumnę i zmień wyświetlaną nazwę na Denied Consent Types (comma separated)

Opcjonalnie: aby dodać obsługę pomijania danych reklam:

1. Kliknij Dodaj pole, wybierz Pole wyboru i zmień nazwę pola na ads_data_redaction.
2. Zmień wyświetlaną nazwę na Redact Ads Data

Dowiedz się więcej o działaniu plików cookie w kontekście pomijania danych reklam.

Opcjonalnie: aby dodać obsługę przekazywania parametrów adresu URL:

1. Kliknij Dodaj pole, wybierz Pole wyboru i zmień nazwę pola na url_passthrough.
2. Zmień wyświetlaną nazwę na Pass through URL parameters

Dowiedz się więcej o przekazaniu parametrów adresu URL.

Aby dodać kod implementacji:

1. W edytorze szablonów otwórz kartę Kod.
2. W przykładowym kodzie poniżej edytuj pola zastępcze.
3. Skopiuj kod i zastąp nim szablonowy kod w edytorze szablonów.
4. Zapisz szablon.

// 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 = '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',
    ad_user_data: consent['adUserDataConsentGranted'] ? 'granted' : 'denied',
    ad_personalization: consent['adPersonalizationConsentGranted'] ? '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) => {
  /*
   * Optional settings using gtagSet
   */
  gtagSet('ads_data_redaction', data.ads_data_redaction);
  gtagSet('url_passthrough', data.url_passthrough);
  gtagSet('developer_id.your_developer_id', true);
  // Set default consent state(s)
  data.defaultSettings.forEach(settings => {
    const defaultData = parseCommandData(settings);
  // wait_for_update (ms) allows for time to receive visitor choices from the CMP
    defaultData.wait_for_update = 500;
    setDefaultConsentState(defaultData);
  });

  // Check if cookie is set and has values that correspond 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();

Następnie skonfiguruj uprawnienia dostępu do stanu zgody i plików cookie.

Aby dodać uprawnienia do zarządzania stanami zgody użytkownika:

1. Wybierz kartę Uprawnienia i kliknij Dostęp do stanu zgody.
2. Kliknij Dodaj typ zgody.
3. Kliknij pole i w menu wybierz ad_storage.
4. Zaznacz Zapis.
5. Kliknij Dodaj.
6. Powtórz kroki 2–5 w przypadku ad_user_data, ad_personalization i analytics_storage. Jeśli potrzebujesz dodatkowych typów zgód, dodaj je w ten sam sposób.
7. Kliknij Zapisz.

Aby dodać uprawnienia dostępu do plików cookie:

1. Wybierz kartę Uprawnienia i kliknij Odczyt wartości plików cookie.
2. W sekcji Określone wpisz po jednej nazwie w każdym wierszu nazwy każdego pliku cookie, który ma odczytać Twój kod, aby określić opcje zgody użytkownika.
3. Kliknij Zapisz.

2. Tworzenie testów jednostkowych

Informacje o tworzeniu testów dla szablonu znajdziesz w sekcji Testy.

3. Integracja szablonu z rozwiązaniem do uzyskiwania zgody

Poniższy kod pokazuje, jak można zintegrować ten szablon z kodem rozwiązania do zarządzania zgodami poprzez dodanie odbiornika:

// 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);
  });
};

Aktualizowanie stanu zgody użytkownika

Gdy użytkownik witryny wskaże wybory dotyczące zgody, zwykle przez interakcję z banerem z prośbą o zgodę na przetwarzanie danych, kod szablonu powinien odpowiednio zaktualizować stany zgody za pomocą interfejsu API updateConsentState.

W tym przykładzie pokazano wywołanie funkcji updateConsentState w przypadku użytkownika, który wyraził zgodę na wszystkie typy przechowywania. W tym przykładzie wartości granted są zakodowane na stałe, ale w praktyce powinny być określane w czasie wykonywania kodu na podstawie zgody użytkownika zebranej przez platformę CMP.

const updateConsentState = require('updateConsentState');

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

Zachowanie w poszczególnych regionach

Aby ustawić domyślne stany zgody, które mają zastosowanie do użytkowników z określonych obszarów, w szablonie określ region (zgodnie z ISO 3166-2). Użycie wartości dotyczących regionów umożliwia użytkownikom szablonów zachowanie zgodności z regionalnymi przepisami bez utraty informacji od użytkowników spoza tych regionów. Jeśli w poleceniu setDefaultConsentState nie określisz regionu, wartość zostanie zastosowana do wszystkich innych regionów.

Poniższy przykład ustawia domyślny stan analytics_storage na denied w przypadku użytkowników z Hiszpanii i Alaski, a analytics_storage na granted w przypadku pozostałych:

const setDefaultConsentState = require('setDefaultConsentState');

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

Pierwszeństwo ma najbardziej szczegółowe ustawienie

Jeśli na tej samej stronie występują 2 domyślne polecenia dotyczące zgody użytkownika z wartościami dla regionu i podregionu, zacznie obowiązywać to, które dotyczy bardziej szczegółowego regionu. Jeśli na przykład w przypadku regionu US ustawisz wartość 'granted' dla parametru ad_storage, a dla regionu US-CA – wartość 'denied', dla użytkownika z Kalifornii będzie obowiązywać bardziej szczegółowe ustawienie US-CA.ad_storage

Dodatkowe metadane

Za pomocą interfejsu gtagSet możesz ustawić te opcjonalne parametry:

• url_passthrough
• ads_data_redaction
• developer_id

Te interfejsy API są dostępne tylko w środowisku piaskownicy szablonów GTM.

Przekazywanie informacji o kliknięciu reklamy, identyfikatorze klienta i identyfikatorze sesji w adresach URL

Gdy użytkownik trafia na stronę reklamodawcy po kliknięciu reklamy, informacje o niej mogą zostać dołączone do adresów URL stron docelowych jako parametr zapytania. Aby zwiększyć dokładność konwersji, tagi Google zwykle zapisują te informacje we własnych plikach cookie w domenie reklamodawcy.

Jeśli jednak ad_storage to denied, tagi Google nie zapiszą tych informacji lokalnie. Aby w takim przypadku poprawić jakość pomiaru kliknięć reklam, reklamodawcy mogą opcjonalnie przekazywać informacje o kliknięciach reklam za pomocą parametrów URL na kolejnych stronach za pomocą funkcji zwanej przekazywaniem adresu URL.

I podobnie, gdy zasada analytics_storage ma wartość „odmowa”, przekazywanie adresów URL może służyć do wysyłania między stronami statystyk dotyczących zdarzeń i sesji (w tym konwersji) bez użycia plików cookie.

Aby korzystać z przekazywania adresów URL, musisz spełnić te warunki:

• Na stronie znajdują się tagi Google wymagające zgody.
• witryna korzysta z funkcji przekazywania danych w adresie URL;
• Tryb uzyskiwania zgody został wdrożony na stronie.
• Link wychodzący odnosi się do domeny, która jest taka sama jak domena bieżącej strony.
• W adresie URL występuje identyfikator gclid lub dclid (dotyczy tylko tagów Google Ads i Floodlight).

Szablon powinien umożliwiać użytkownikowi skonfigurowanie, czy to ustawienie ma być włączone. Ten kod szablonu służy do ustawiania parametru url_passthrough na wartość „true”:

gtagSet('url_passthrough', true);

Usuwanie danych reklam

Gdy ad_storage zostanie odrzucone, nie zostaną ustawione żadne nowe pliki cookie do celów reklamowych. Dodatkowo nie będą używane pliki cookie innych firm ustawione wcześniej na stronach google.com i doubleclick.net. Dane wysyłane do Google będą nadal zawierać pełny adres URL strony, w tym wszelkie informacje o kliknięciu reklamy w parametrach adresu URL.

Aby jeszcze bardziej zaciemnić dane reklam, gdy ad_storage zostanie odrzucone, ustaw wartość ads_data_redaction na prawda.

Gdy parametr ads_data_redaction ma wartość true, a parametr ad_storage ma wartość denied, identyfikatory kliknięć reklam wysyłane w żądaniach sieci przez tagi Google Ads i Floodlight zostaną usunięte.

gtagSet('ads_data_redaction', true);

Identyfikator dewelopera

Jeśli jesteś dostawcą platformy CMP i masz identyfikator programisty wydany przez Google, użyj tej metody, aby jak najszybciej ustawić go w szablonie.

Identyfikator dewelopera jest potrzebny tylko wtedy, gdy Twoja implementacja będzie używana w wielu witrynach przez niepowiązane firmy lub podmioty. Jeśli implementacja będzie używana przez jedną witrynę lub podmiot, nie składaj wniosku o identyfikator dewelopera.

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

Udostępnianie dokumentacji użytkownikom

Użytkownicy będą używać szablonu zgody do konfigurowania tagu, który zbiera zgodę użytkowników. Udostępnij użytkownikom dokumentację, która wyjaśnia te sprawdzone metody:

• Jak ustawić domyślne ustawienia zgody w tabeli Ustawienia.
• Jak skonfigurować domyślne ustawienia zgody użytkownika dla różnych regionów przez dodanie dodatkowych wierszy tabeli.
• Uruchom tag za pomocą reguły Inicjacja zgody – Wszystkie strony.

Dalsze kroki

Jeśli chcesz udostępnić szablon wszystkim użytkownikom Menedżera tagów, prześlij go do Galerii szablonów społeczności.