Return to site

【GTM教學】新手篇:十分鐘搞懂 Google Tag Manager

· GTM,全部文章

你是不是也有以下困擾呢?

  • 只要跟廣代合作就要請工程師在網站中埋入廣代的追蹤碼,等待工期讓你錯失最佳廣告投放時機?!
  • 不懂程式的行銷人每次要埋碼只能雙眼傻看螢幕,或懇求工程師幫幫忙,但常遇溝通鴻溝心很累
  • 埋了成千上萬個追蹤碼,也搞不清楚到底埋了哪些
  • 代碼埋得太多,導致網頁載入的速度很慢,等待的時間令人抓狂
  • 想要查看成效,卻不知道到底哪個追蹤碼有帶來轉換

行銷小伙伴的痛苦我們都知道!今天就介紹一個解套神器,讓行銷人從一連串複雜的代碼中解放出來,現在,就讓我們來認識一下這個工具是什麼吧!

Google Tag Manager(以下簡稱GTM)

一款强大的免费代碼部署工具,你可以將所有需要修改或者更新的代碼上傳至GTM,安裝完成後,網站分析師與行銷人員不用去修改、更新網站的原始碼,透過GTM即能輕易地將各種追蹤程式碼以及第三方應用工具安裝到網站中,讓追蹤和管理都在同一個平台完成。

現在就讓我們來認識GTM,10分鐘從埋碼地獄中解脫 !

使用GTM的管理優勢

對於不會寫程式代碼的行銷人而言,GTM簡直就是救星。使用GTM進行管理,不僅可以減少埋碼的人力投入、簡化流程外,還可以降低人為操作失誤,一次看到目前所有代碼的運行狀態,埋代碼不求人外,也可以幫助用戶在進入網站時有更好的體驗,快點一起來看看吧!

簡化埋碼的流程

簡單來說,我們就是把在這個商店裡面四處散落的商品,規整到一起排列好,讓我們可以輕鬆管理Google Analytics、Google AdWords、Facebook Pixel 或其他第三方工具,讓我們不在需要把代碼一個一個埋進去網站後台,簡化了埋碼流程,統一管理

提升網站的載入速度

在網站後台埋入大量的追蹤代碼,會增加網頁讀取的時間,但透過GTM管理的代碼則不會被寫入網站的html之中,如此以來就可以加快網頁載入速度,提升使用者體驗,同時優化SEO排名。

減少代碼埋錯的機會

過去我們直接在網站後台埋碼,若想檢驗網站的埋碼有沒有成功,必須要發布網站後才可以進行測試。但如果我們今天改用GTM進行安裝管理,便可以在代碼發布前先偵錯,直接就可以進行調整。

若代碼更新有發現錯誤,GTM是以版本做紀錄,使用者可以還原最初埋設的版本

.

Google Tag Manager 基本內容介紹

Google Tag Manager包括幾個部分:

Accounts(帳戶)、Containers(容器)、Tag(代碼)和Triggers(觸發器)、資料層Data Layer。

Accounts(帳戶)

帳戶是GTM中層级最高的,通常情况下每個公司只需要一個帳户。

一個帳戶可以用來管理一個或多個電商網站,一般來說一家公司只需要一個帳戶,便可管理旗下所有電商網站。如果有多個網站要安裝各自的代碼,可以創建多個容器(containers)。這樣就可以同時追蹤不同公司的行銷成效。

若需創建新帳戶,可按下GTM頁面又上的「建立帳戶」如下圖

google tag manager

.

Containers(容器)

容器是專門放置標籤 ( Tag ) 的地方,一個帳戶中至少會有一個容器,用來放置標籤 (Tag) 跟觸發器( Trigger )

一般來說,一個容器會對應一個網域,對應的容器可以存放多組標籤 (Tag) 跟觸發器( Trigger ),因此就不需要在每個網頁都放入程式追蹤碼

舉個例子,一個容器可能會含有一個代碼標籤記錄特定行為,比如會員註冊,並且含有一個觸發條件是當會員註冊成功通知跳出時,代碼標籤會記錄這項資訊

如果要新增容器,可點一下齒輪符號選擇「建立容器」

.

Tag(代碼標籤)

網站後台新增各種追蹤碼的最終目的,就是要收集用戶的特定行為進行數據的判讀與分析,這些片段的程式碼具有不同的用途,最常見的用途就是回傳訊息。

當我們在不同的行銷活動上進行標記時,程式碼會將其接收到的訊息回傳至第三方工具,用來分析行銷活動的成效,而這些負責收集相關訊息的程式碼就被我們稱作標籤 ( Tag )

新增標籤 ( Tag ) 的方式如下:在「容器」中選擇「新建代碼」,如下圖。

代碼標籤( Tag ) 的追蹤類型有以下5種:

  • 事件
  • 交易
  • 計時
  • 裝飾連結
  • 裝飾表單

.

Triggers(觸發器)

Triggers(觸發器)定義得代碼被觸發的規則,其中的觸發條件是由變數(Variables)、運算符號(Operators)與值(Values)所組成。一般的運作模式如下圖,我們會設置觸發事件,告訴系統在什麼情況下可以開始收集資料。

  • 變數Variable
    變數是定義觸發條件執行的規則,告訴代碼標籤該在什麼時候回傳訊息。而變數又可以細分為內建變數(Built-in Variables)與使用者自訂變數(User-defines Variables)兩種。內建變數是系統預設,有相當多種常用的觸發方式,比如點擊類別(Click Classes),你只要簡單點選即可啟用;而使用者自訂變數是我們根據需求特別定義的變數,比如購買完成(purchaseComplete),當成功進行交易後才回傳資料。
  • 運算符號Operator
    運算符號定義變數與值之間的關係,系統用來判斷觸發條件的狀態( true 或 false),兩者之間一定要對應上才能確保觸發條件順利運行,最常見的運算符號如等於(equals)、包含(contains)、或未包含(doesn’t contains)。
  • 值Value
    明確定義變數的內容,比如出現特定數字或是網頁網址,便會觸發代碼標籤收集資訊。

使用者可以根據想要追蹤的目標選擇類型。觸發條件類型(Trigger Types)有許多選擇,例如:網頁瀏覽、網頁點擊、網頁元素可見度、網頁表單提交、網頁紀錄變更、JavaScript 錯誤、網頁捲動、網頁計時器、網頁影片(例如YouTube)、自訂觸發事件等等。

假如我們想要評估使用者對這個頁面內容感興趣的程度,我們可以觀察用戶平均的網頁捲動深度,可以參照「網頁捲動頁數」觀察使用者看到哪裡,並設置觸發條件,這樣我們就可以收集到該部分的資訊囉!

.

Google Tag Manager設置流程

了解了GTM是什麼以後,現在就開始來實操吧!

1. 設置帳號名稱與容器名稱

進入GTM後,先創建帳戶,再來是創建容器名稱,最後將要監測該網站的所有代碼添加到剛剛命名的容器中。

2. 將GTM程式碼貼到網頁原始碼中

創建完成後,GTM會提供一段代碼,將代碼埋入要追蹤的網站頁面原始碼<head>與<body>後面,即可完成設置。

3. 確保GTM安裝成功

在這邊給大家推薦一個Chrome的擴充功能 Tag Assistant ( by Google ),我們可以使用這項功能了解是否已經正確且成功地在網站上安裝各種標籤,安裝完成後啟動,重新刷新頁面就可以看到是否有跑出來相對應的代碼,到這裡就大功告成啦!

總而言之,Google Tag Manager是一個功能強大的標籤管理工具,可以幫助你快速的更新或新增網站上的代碼,如果有埋設/數據問題或是 GTM的自訂觸發條件規劃,圖靈數位都可以提供專業的協助!

All Posts
×

Almost done…

We just sent you an email. Please click the link in the email to confirm your subscription!

OK