如何為面向歐美的網站添加跟踪許可?

Photo of author
Written By CMO

只要我們做出海生意的就一定知道歐洲有GDPR,美國有CCPA。因此我們訪問這兩個地區網站的時候總會有彈出窗口,問你要不要接受Cookie,要不要接受跟踪。這是隱私保護合規的重要舉措,但這也為我們製造了不少麻煩。因為我們現在必須要在用戶允許跟踪之後才能調用Google Analytics這樣的工具進行跟踪了。

本篇行銷長將會用Google Tag Manager結合GA4標籤在WordPress平台上用一個例子來解釋部署方法。

安裝彈窗插件

我們這次使用的是一個叫Beautiful Cookie Consent Banner的WP插件。

安裝插件到WP用於彈窗
安裝插件到WP用於彈窗

該插件是行銷長隨便找的,有幾個優點:

  1. 免費! ! !
  2. 不會從第三方下奇怪的資源。
  3. 自動會推送event到datalayer。
  4. 可定制對話框樣式。
  5. 會自動刪第一方Cookie。

啟用後,按喜好設置。但記得Push consent event to dataLayer要勾上。

在本文的實例中,我們Compliance Type會選擇Ask user to Opt-in 。這樣的話,當新用戶來到我們網站的時候Google Analytics不會啟用,一直到用戶點擊Allow允許我們跟踪以後GA4的標籤才觸發。同時,我們會把選擇保存至第一方Cookie,記住用戶的選項。

另外我們先記下來:

  1. beautiful_cookie_consent_updated會被push到datalayer
  2. cookieconsent_status是默認使用的cookie名稱,有allowdeny兩個值。

GTM中啟用Consent Overview

Admin > Container Settings > Additional Settings可以打開Consent Overview模式,該模式還在beta中。

許可一欄界面入口
許可一欄界面入口

回到Workspace點擊左邊菜單的Tags ,可以看到所有Tag的列表。而在列表的右上角,在New按鈕的左邊,有一個盾牌打勾的圖標。這裡就可以去到Consent Overview界面。這裡可以看到哪些被設置和consent相關的標籤和未設置關聯的標籤。

今後需要了解Container中關於Consent的問題都可以到這個界面查看。方便很多。

添加變量獲取Cookie狀態

添加一個ConsentStatus變量
添加一個ConsentStatus變量

這個變量用於抓取Cookie中插件設置的值,通過這個值我們可以決定是不是觸發GA4的標籤。當然,我們也會對其設默認的值deny

HubSpot One認為通過Cookie來獲得狀態要比在datalayer中獲取要可靠。然後我們把Cookie的值轉化為Google聽得懂的Consent Mode的值: granted或者是denied

一個Lookup Table類型的變量
一個Lookup Table類型的變量

上面我們建立了一個Lookup Table類型的變量,把Cookie的值翻譯成了denied或者granted

新建兩個觸發器捕獲許可變動

首先我們建立一個新Trigger,用來記錄用戶點擊Allow或者Deny按鈕的行為。

Cookie許可更新觸發
Cookie許可更新觸發

接下來我們要捕捉GTM中許可變更的事件,這也要建一個Trigger。

捕獲GTM中許可變動事件
捕獲GTM中許可變動事件

這就問題來了, beautiful_cookie_consent_updated事件是如何變成gtm_consent_update事件的呢?我們先把問題放一放。因為接下來我們就要建一個標籤了。

新建初始化許可和更新許可的標籤

首先,每個頁面載入的時候都會有一個早於所有事件發生的事件—— Consent Initialization 。在這個事件發生的時候其他標籤還沒被觸發。此時我們便可以對許可進行初始化。

這裡我們用到了Simo Ahava的第三方標籤模板。我們可以在Community Template Gallery中找到。名為Consent Mode (Google tags) 。載入後按下圖設置:

默認許可設置標籤
默認許可設置標籤

這裡用到了我們剛剛從Cookie中抓的變量Cookie Consent ,其值為deniedgranted 。 Command設為Default表示我們抓的是當前的默認值。

同樣,我們再做一個Tag。

更新許可標籤
更新許可標籤

這一次我們Command設為Update 。關聯的觸發器是Consent Updated ,這是我們上面新建的。同時我們會把一個Event推送到dataLayer。這個Event的名字是gtm_consent_update

更新GA4標籤

現在,我們可以更新GA4標籤來決定什麼時候跟踪,什麼時候不跟踪了。

為GA4標籤設置許可觸發條件
為GA4標籤設置許可觸發條件

我們這次啟用了Consent Settings 。在ad_storageanalytics_storagegranted的時候標籤就會被觸發。你可以發現我們還加了一個我們剛才新建的觸發器GTM Consent Updated 。此時頁面不會重新加載,但如果用戶是點擊了Allow,那麼GA4將會在此時加載。

到此為止,我們已經建立了所有我們需要的Tag,Trigger,Variable。你可以調試一下,看看是否起作用。成功後你可以把更多的標籤添加許可並在Consent Overview中管理。

這個HubSpot One的例子中,我們用到了一個插件,這其實是一個輕量級的CMP(Consent Management Platform)。當然市面上有更多更複雜的CMP,有的和GTM也有不錯的整合,值得讀者的探索。

Google Consent Mode

講到這裡,我們有必要再提醒一下各位讀者。本篇我們舉的例子是根據不同的用戶許可來決定是否Fire GA4標籤的。這是非常嚴格的做法,你會因為用戶未授權丟失用戶訪問的統計。但事實上,我們可以對GA4標籤不做處理。在Google Consent Mode下,它會根據不同許可改變谷歌系標籤的行為。這些標籤包括Google Ads,Google Analytics,Floodlight。也就是說上例中最後一步如果我們不做,GA4的Library會被加載,但是是否獲取敏感訊息是否使用Cookie依舊會看Consent狀態。