不會程式語言 也能學會Google Tag Manager 免費一站式 HTML Tag 管理工具 (zh-cn translation)

Google Tag Manager(GTM) 是一個程式碼管理工具, 能快速加入或更新程式碼片段(tag)。只要加入GTM到網站後,就能在同一個管理平台上,管理所有的tag(例如 Google Analystics, Bing, Pinterest 或任何自訂tag)。即使沒有學習過程式碼,也能輕鬆地透過圖形用戶界面(GUI)去管理各種tag, 不再需要每次經由IT部門更新網站。

現時,不論由一般小型網站到大型網站,GTM已是必須安裝的工具。從事Digital Marketing相關工作的人,也必須學習GTM的使用方法。

這篇文章,不會詳細講解配置方法,主要是給一些從未接觸過GTM的人,透過本文了解GTM的基本確念,如何讓GTM為網站帶來好處.

[ultimate_heading main_heading=”GTM使用方法” main_heading_font_size=”desktop:25px;” margin_design_tab_text=””][/ultimate_heading]

在GTM申請賬號後,你會得到兩段程式碼,分別放到你網站內的所有網頁中的 head 和 body 內容中。之後你就可以開始用啦. 詳細的申請過程,這裡就不說啊,可以到GTM網頁內查看。
https://support.google.com/tagmanager/answer/6102821?hl=zh-Hant&ref_topic=3441530

[ultimate_heading main_heading=”GTM 的原理” main_heading_font_size=”desktop:25px;” margin_design_tab_text=””][/ultimate_heading]

GTM的原理,就像一個容器,把tag都在其中,而我們也把這個容器放在網站內的每一網頁中。那用戶到任何一網頁,這些tag就能運作。如果要加入或更改tag內容,只需更改這個容器內的tag,那整個網站都能同時更新。

還有一個重要功能,我們能夠為每一個tag加入觸發條件。例如設定 Tag A 只會在網站首頁才會運行,Tag B 只會在經某個網站來(檢查Referer)才會運作等等……

[ultimate_heading main_heading=”對 Affiliate Marketing 有甚麼幫助?” main_heading_font_size=”desktop:25px;” margin_design_tab_text=””][/ultimate_heading]

對於廣告客戶(Advertiser)來說,使用 Affiliate Marketing 時,必須安裝追踨代碼來追緃有效的轉換(conversion)。由於一般都要在特定網頁安裝不同程式碼,經由GTM就能很容易加入需要的程式碼。如果經由IT部門續一加入的話,很多大型公司都需要花大量時間安排時間修改網站,

在我們的經驗中,有客戶沒有使GTM,結果等待了六個月時間,他們的IT部門才有空去修改網站。而有使用 GTM 的客戶,由於Marketing部門有更改GTM的權限,由我們提供程式碼給他們,測試,然後到正式使用,只花了半天時間。

[ultimate_heading main_heading=”GTM 功能” main_heading_font_size=”desktop:25px;” margin_design_tab_text=””][/ultimate_heading]

打開GTM的管理頁面(workspace), 在目錄內會看到不同的連結,我們這裡會說明最常到的四個頁面。

第一個 Overview , 可以看到現在正在使用的版本, 有多少HTML Tag, 和過去的修改的記錄等等…… 都是給你檢查用的,沒甚麼需要說明。以下的就要特別注意啊!

第二個 Tags , 就是存放各種程式碼片段(Tag)的地方,例如 Google Anaytics,Twitter 等已經整合到GTM的服務,基本上加入賬戶號碼就可以,不需要把程式碼重新抄過來。另外,也可以加入自訂Tag,有 Image Tag 和 HTML Tag, 大部份追蹤代碼都可以以Image Tag的方式運作,而我們的 Conversion Tag也可以用這個方法的。另外 HTML Tag 則可以存放一般的 HTML 或 JavaScript 代碼。需然 HTML Tag 部份非常方便,但也需要特別注意,不然有機會影響到網站運作啊!

第三個Triggers 的部份,就是剛才有提到,為每個Tag加入觸法條件。其實在新增Tag的時候,就可以同時加入觸法條件(Trigger), 如果要修改/增加,就可以在這裡處理了。不過有些地方(例如page view), 可能會用到正規表示式法(regular expression)。如需學習正規表示式法, 網上可以找到很多教學。https://regexr.com/ 這個網站可以測試你的表示方法是否正確,也有 Cheat Sheet 提供,非常好用。

第四個Variable 的部份,一般使用者,對這個會比較難理解,其實就是把需要的東西(例如指定cookies, URL…) 設定成 variable , 供 tag 或 trigger 使用。

例子:當用戶進入網站首頁,而 URL 裡的 query string 中,article_id(key) 是 111(value) 的時候,執行 Tag A

Tag:

用戶就需要設置以下項目

Variable:

增加 article_id_value 為variable名稱, 從query裡,抽取 article_id 的 value, 並放到 article_id_value內。

Trigger:

由於有兩個條件,所以要加入兩個trigger條件.

條件一:當url中, path 是以 home 為開始 (假設homepage為 example.com/home)

條件二: 當variable – article_id_value 等於 111

測試:

當用戶進入首頁,並且GTM在cookies中找到article_id_value 等於 111,就會觸發 Tag A 運行。否則,不會執行 Tag A.

以上就是 GTM 的基本運作確念,雖然在實際運作時會有更復雜的情況,但是都離不開以上 Tags, Triggers 和 Variable 的模式.  如需要深入認識,就要多學習網路和網站知識,我們都會不定期提供相關文章,記得密切留意啦!