GTM 變數介紹:第一方 Cookie(1st Party Cookie Variable)

透過 GTM 取得網站上的參數並傳送到 GA4 是行銷人使用 GTM 很大的原因之一,之前已經介紹過資料層變數以及網址變數這兩個可以幫助我們取得網站參數如:購買產品名稱、訂單價格、數量以及流量來源等,接下來這篇文章我們將要介紹一個對於網站追蹤更棒的東西,也就是:第一方 Cookie 變數(1st Party Cookie Variable)

第一方 Cookie 變數可以幫助我們取得存在 Cookie 中的值,接著再利用該 Cookie 中的值幫助我們觸發相關事件或是隨事件代碼傳送相關參數到 GA4,像是:

  • 取得存在 Cookie 中的使用者會員等級、觀看過多少頁面?
  • 使用者是否曾經到過我們指定網頁?
  • 排除掉看過特定蓋版廣告的使用者,不再投遞蓋板廣告避免影響網站使用體驗。
  • 針對看過 3 頁以上的使用者投遞優惠訊息。
  • 記錄下使用者是否來自特定合作夥伴,了解異業合作的成效。
    (可以看到這個使用者都去看了網站的哪些地方。)

上述的這些,都可以利用 GTM 內建的「第一方 Cookie 變數」來做到。



Cookie 是儲存在網頁瀏覽器上的小文件,最大僅 4KB,通常是用來儲存使用者在網站的行為記錄、用戶特定偏好或是追蹤用戶的行為,主要是為了優化使用者的體驗以及達成更加精準的廣告投放。

而 Cookie 又可以分為第一方 Cookie 以及第三方 Cookie,兩者之間的差異如下:

第一方 Cookie(1st Party Cookie)第三方 Cookie(3rd Party Cookie)
由你正在瀏覽的網站設置的 cookies不是由你直接訪問的網站擁有,而是來自於網站上嵌入的其它追蹤代碼,例如廣告商或分析服務提供商。
主要用於保存你的登錄紀錄、記住個人網站行為或其它該特定網站相關的設置,如語言偏好、會員等級等。主要用於跨網站的行為追蹤,提供個性化廣告和進行分析。
只能被設置它們的網站讀取,相對安全和私密。可以被多個不同的網站讀取,因此具有潛在的隱私風險。
例如:GA4、Metapixel例如:Metalpixel、廣告商代碼、再行銷代碼
第一方 Cookie V.S 第三方 Cookie

大部分廣告代碼如 Metapixel 都會在網站上建置第一方以及第三方 Cookie,透過第三方 Cookie 的建立,可以追蹤並記錄使用者在不同網站的瀏覽行為,打造使用者輪廓以及了解使用者興趣,讓廣告更精準的投遞以及進行再行銷。

不過第三方 Cookie 這件事情因為有過度暴露使用者隱私的風險,Google Chrome 已經計劃在 2024 開始讓其逐步於自家瀏覽器中消失,不再讓廣告商設置第三方 Cookie。

(更新:2024 年 7 月,Google 宣布「停止」第三方 Cookie 退場計畫,未來的 Chrome 瀏覽器會持續保有第三方 Cookie。)


網站上按右鍵 > 檢查 > Application 頁籤 > 左邊找到 Cookie 後展開


如果今天我們與網紅合作,我們想要追蹤透過網紅連結進來的使用者有多少以及有多少人產生購買行為,並假設已經網站工程師已經幫我們設定了一組名稱為 Influencer_id=「網紅ID」 的 Cookie。

透過上一段的查找方式,可以看到在網站上存在一組名稱為「Influencer_ID」,值為「MKTGholic」的 Cookie,接下來我們可以透過 GTM 的「第一方Cookie 變數」來取得這個值。

GTM 變數介面 > 新增使用者定義變數 > 選擇「第一方 Cookie」

設定完成之後,一樣可以先來到預覽模式確認是否有正確抓取到該 Cookie 以及其值。

確認在變數頁籤中有看到我們所設定的「第一方 Cookie 變數」,且值也與網站上的值相同後,變數的設定就告一個段落了,接下來就看想要運用在哪個代碼上,跟著代碼一起傳送到 GA4 中或是將該變數作為觸發條件,啟動需要的事件代碼。


我們可以這麼做,延續上一段的我們所設定的「第一方 Cookie 變數」,假設想要針對來自這個 Influencer 觸發一個彈窗優惠訊息,所以情境會是:

當使用者是透過網紅 MKTGholic 的連結點擊進來時,跳出 20% 的折扣優惠視窗

可以在觸發條件的地方依下圖方式設定,當第一方 Cookie 變數(前面設定的)為 MKTGholic 時,啟動一個折扣優惠彈窗代碼,或是任何你想要透過這個條件啟動的代碼。


將「第一方 Cookie 變數」與事件綁定

假設我們希望當 GA4 代碼或是特定事件代碼啟動時,這個「第一方 Cookie 變數」的值會跟著代碼一起傳送到 GA4 中,方便我們日後分析使用者行為,例如:這個網紅帶來的使用者看過多少頁面? 我們就可以在代碼設定中做以下的設定。

以上述的範例來看,我們給了使用者一個狀態叫做「來自 Influencer MKTGholic 」的使用者,並且存在 Cookie 中,因此可將其歸類在使用者狀態層級,我們可以把這個放入 GA4 的 User 層級(User Scope)中,以紀錄這個使用者在網站上的行為,未來只要在報表中找到這個維度並篩選僅來自 MKTGholic 的資料,就可以知道這個網紅為我們網站帶來多少流量。

先到變數類型「Google 代碼:事件設定」中,將「設置的第一方Cookie 變數」放入參數配置,如下圖:

接著來到 GA4 代碼的設定頁面 > 共用事件設定 > 選擇上面設定的「Google 代碼:事件設定」變數。

(如果還沒安裝 GA4 的朋友,可以參考這篇文章。)

完成之後按下儲存,ㄧ樣來到預覽模式以及 GA4 Debug View 測試,確認代碼是否有成功傳送資料,GA4 是否有接收到資料。

(下圖資料必須點開事件的代碼卡才會看到,如果不知道如何到達以下畫面的朋友可以看這段文章)。

GTM 預覽模式代碼卡細項資訊

再來到 GA4 Debug View 中,可以看到傳送進來的使用者屬性參數,這樣就大功告成了。

GA4 Debug View

最後一個步驟,記得要去 GA4 的自訂定義中設定這個參數為維度,未來在報告中才可以取用。(如果不知道要去哪裡設定自訂維度,可以參考這篇 GA4 後台介紹的文章。)

GA4 自訂定義 > 自訂維度畫面

同樣的道理,我們也可以運用在電子商務的購買事件或是表單提交事件的設定,將儲存在 Cookie 中的資料與購買事件代碼一起發送到 GA4,幫助我們了解與網紅或是外部合作的成效。


總結一下「第一方 Cookie 變數」

將資料存在 Cookie 然後透過 GTM「第一方 Cookie 變數」取得,其實跟之前我們介紹過的「 Data Layer 資料層變數」大同小異,都是透過類似的方式幫助我們做到更完整的追蹤,現在認識了「第一方 Cookie 變數」,當需要的參數不在 Data Layer 而是存在 Cookie 裡時,可以運用這個方式來幫助我們解決問題。

還有一點要注意的是,Cookie 是跟隨裝置瀏覽器的,假設使用者 A 早上透過桌機點擊了網紅的連結來到我們的網站,並被記錄了到 Cookie 中,晚上使用手機時則再度被網紅的廣告打到,同樣點擊了連結來到我們的網站,此時因為更換裝置, Cookie 也會不一樣,所以會被歸類為不同的使用者(雖然是同一個人),這是個很常讓人誤會的情況,許多人以為透過 Cookie 就可以跨裝置追蹤,事實上是不行的。(但可以跨網域追蹤)


延伸閱讀: