GTM新功能,了解訪客愛多深,滾多遠

Photo of author
Written By CMO

衡量訪客的Engagement,我們有了新的方法
衡量訪客的Engagement,我們有了新的方法

我們在統計頁面訪客對我們準備的內容是否喜愛的時候常用的方法是統計用戶看了多少內容。這和我們統計用戶觀看影片看了多少的方法一致。在實際操作中我們往往使用用戶向下滾動鼠標或者向上滑動屏幕來衡量這個指標:Engagement。

HubSpot One在兩年前曾給出科學分析跳出率的理念和方法,其中用到的標準是停留30秒以及至少兩次滾動。這比單純地去統計跳出率可謂進了一步,因為不感興趣的受眾看都不看。

愛你有多深,滾你就有多遠

當時我們用了一些自定義JavaScript來實現滾動的監聽,說起來還比較麻煩。最近Google Tag Manager(GTM)的一次更新又給大家送福利了,這次GTM添加了原生觸發器Scroll Depth 。你可以在Trigger,Trigger Configuration-Choose trigger type的User Engagement中選擇Scroll Depth。如下圖:

啟用滾動深度觸發器相當簡單,它已成為原生觸發器
啟用滾動深度觸發器相當簡單,它已成為原生觸發器

接下來,你可以選擇是否開啟縱向滾動(Vertical Scroll Depth)深度監測和橫向滾動深度(Horizontal Scroll Depth)檢測。並且,你可以選擇按照百分比還是像素值來監測。最後你可以限制該觸發器只在某些文章頁上啟用。

在設置數值時,必須是正整數,用英文逗號分隔。而且HubSpot One建議大家數值小的就不要設了,一是太浪費首屏就可觸發,分析上又不會去用,二是免費版本Google Analytics的Hit Level每個Session只500次

設置觸發器時可以設置多個標記點,用英文逗號分隔
設置觸發器時可以設置多個標記點,用英文逗號分隔

滾得遠並不代表愛得深

那麼問題來了,很多時候我們“一滾到底”並不代表我們在認真閱讀,更多時候我們在尋找我們需要的答案。所以我們需要再次加上計時器來衡量是否訪客和我們的內容產生了化學反應。在此先提醒大家一點:雖然這個觸發器的名稱叫Scroll Depth,但是和Scroll的動作並不太相關。只是說明用戶看到了頁面的哪個部分。假設你在頁面讀取後按鍵盤上的End,頁面會滾動到底部,所有的標記點事件都會被觸發。刷新頁面也一樣。

為了更清晰地了解讀者的情況,我們制定一個規則:在頁面打開三十秒後,我們去查看用戶最多讀到哪裡

要在GTM中實現這一跟踪,我們需要下面這些標籤,變量和触發器。

標籤:UA標籤和數據層變量修改標籤

UA標籤(命名為NoBounceReader )為的是提交一個Event給GA並傳遞該時該刻讀者閱讀的最大深度。其中用到了當時閱讀最大深度變量Read Depth和触發器Reading

數據層變量修改標籤(命名為CheckReadDepth )作用是每當Scroll Depth觸發器被觸發時會去更新最大的閱讀深度。類型是Custom HTML,內容就一行字:

<script>if({{MaxDepth}}<{{Scroll Depth Threshold}}) {{MaxDepth}} = {{Scroll Depth Threshold}};</script>

其中MaxDepth是一個數據層變量,它對應的GTM變量就是我們剛才提到的Read DepthScroll Depth Threshold變量是默認的。你可以在Configuration中啟用

你必須啟用該默認變量,不然它將被隱藏
你必須啟用該默認變量,不然它將被隱藏

變量:當前最大閱讀深度

當前深度(命名為Read Depth )這就是我們剛才提到MaxDepth 。類型為數據層變量,初始默認值為0。

觸發器:Scroll Depth觸發器和計時觸發器

滾動深度觸發器(命名為Article Scroll Depth ),我們只設縱向滾動,標記50%和75%兩個點。它會觸發CheckReadDepth標籤並僅在需要的頁面啟用。

計時觸發器(命名為Reading ),類型為Timer。 Event Name為gtm.timer。我們設為30,000毫秒的interval,只設1次的Limit並僅在需要的頁面啟用且僅當Read Depth大於0時觸發。這裡需要多次觸發可以酌情增加。

計時器何時起用何時觸發在不同地方設置
計時器何時起用何時觸發在不同地方設置

工作原理解析

當訪客到達頁面後, Reading計時器開始啟動。當用戶每過一個標記點時,變量Read Depth (即數據層變量MaxDepth )將會更新為最大的標記點值。 30秒後如果Read Depth大於0則觸發UA標籤NoBounceReader將當前最大Read Depth推送給GA。

那麼我們到這裡就大功告成了。如果你在使用中有疑問,請訂閱HubSpot One的微信公眾號詢問。此外Simo Ahava對此也進行了詳細介紹,請深入閱讀。