什麼是GTM (Google Tag Manager)

Jay_Gao發表於2019-04-04
Go

什麼是GTM(Google Tag Manager)

gtm是谷歌開發的跟蹤程式碼管理器, 可以在平臺上新增和更新自己的程式碼，用於轉化跟蹤、網站分析、再營銷等用途。

優點

  • 靈活性, 無需修改專案原始碼就可以部署更新
  • 網站統計分析的程式碼可以統一管理
  • 功能強大, 可以新增js,html,圖片等模板, 與第三方工具高度整合
  • 方便除錯

如何使用

gtm有免費的版本, 可以上 marketingplatform.google.com/about/ 註冊並開通賬號, 之後gtm會給你一個js程式碼塊, 需要你放到每個html頁面的<head>標籤裡面, 程式碼類似於下面這樣, 裡面會有個GTM-XXXXX 便是你的gtm container的ID, 需要替換成你自己container 的id

<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXX');</script>
<!-- End Google Tag Manager -->
複製程式碼

Tag (程式碼片段)

gtm最重要的部分, 可以在tag裡面部署 google資料分析相關服務, 或者第三方服務, 如果某些服務商沒有整合在gtm裡面, 還可以通過嵌入自定義程式碼的方式來部署. 可以看到tag裡面有相當多的方式來部署你的程式碼.

image-20190404121405992

Trigger (觸發器)

每個tag必須關聯trigger用來觸發tag的執行. 舉個例子, 你希望某段統計程式碼只有在訪問特定url的時候才會執行上報, 這時候就需要新增trigger來指定條件.

Trigger 有相當多的觸發方式, 你可以選擇頁面載入完成後觸發, 某些dom元素可見時觸發, 使用者點選某個按鈕觸發等等.

image-20190404114656052

Variable (變數)

大部分情況下資料統計都需要上傳一定的資訊, 比如電商網站需要統計使用者購買了何種商品, 數量及價格等等, 或者使用者點選了哪些按鈕, 這些都需要通過變數的形式來定義, 變數設定後tag和trigger都可以引用, trigger可以引用變數來定義一些觸發條件, 比如使用者在某種語言下才觸發. tag可以獲取variable的值並上傳到相關的服務商.

variable也有很多型別, 可以是當前頁面的url, 或者是自定義js計算得到的值.

最普遍使用的則是 Data Layer Variable

image-20190404115630443

Datalayer(資料層)

gtm指令碼執行時會建立一個dataLayer的全域性物件, dataLayer實際是是一個陣列, 你可以通過dataLayer.push()來新增相關的資料, 可以很方便的在gtm variable裡面獲取到.

比如你新增了一個描述當前頁面型別的屬性dataLayer.push({pageType:'home'}), 就可以通過這樣定義Variable來取值

image-20190404120837582

這裡要注意的是取值的時機, 比如你在使用者購買某個商品之後將相關的資料新增到dataLayer, 那麼如果某個Trigger在這個按鈕點選之前就被觸發(如 PageView型別的trigger), 那麼這時候是獲取不到這個商品的資訊的. 所以理清trigger的觸發條件, variable 被新增的時間是非常重要的, 如果順序亂了就會得到undefined的結果, 影響到資料統計的準確性.

相關文章