在 《Google Tag Manager 教學，一篇搞懂如何設定和管理網站追蹤碼》這篇文章裡我們曾經介紹過Google Tag Manager是什麼、為什麼要使用、它的基本組成規則、設定，以及串接Google Analytics。
這篇文章將更詳盡地告訴你，怎麼使用Google Tag Manager在你的登錄頁面、追蹤使用者在網頁上的活動、Facebook pixel 像素的安裝，以及如何更容易地理解GTM的進行方式和能夠幫助你的地方，讓你不必透過工程師，就能輕鬆透過GTM管理自己的代碼追蹤。
簡單來說，使用Google Tag Manager的原因是為方便管理，讓你想要追蹤的所有資訊一併透過Tag Manager放在你的網站上，一目了然自己在網站裡埋了哪些code，同時也可以避免網站有太多來自不同管道的程式碼使得加載速度變慢。
當你特別想要了解使用者在你的網站上進行的活動，比如從網站的哪個入口處訂閱電子報、在哪個步驟放棄購物車、提交表單的情形、點擊按鈕的熱度、登錄頁面瀏覽的百分比，又或者想要安裝像素供未來廣告投放的再行銷，都可以透過GTM統一管理。
TransBiz的GTM：
GTM的組成是讀取代碼裡的內容帶動觸發條件裡面的變數，寫入資料。
代碼：你讀取哪裡的資料。
比方說：GA、Google AdWords、Bing、Crazy Egg、Hotjar、Twitter、LinkedIn、Facebook pixel…
命名：FB Pixel Base Code, GA PageViews, GA-Event-Sign up Newsletter, FB pixel Conversion-Purchase….
觸發條件有不同的類型：如網頁瀏覽、點擊（連結、所有元素—Click/form）、使用者主動參與（Youtube影片、網頁瀏覽百分比、表單提交）、自訂事件、網頁無法開啟等。
觸發條件的名稱設定：Form Submission, Purchase-item name, item-Add to cart, View Video, Scroll-article name
變數：點擊網站上的某個文字、某個按鈕、提交表單、網址、瀏覽路徑、影片觀看的時間、影片的標題、捲動網站頁面的比例。
講到這邊你可能還是一頭霧水，不如就直接以常用的GTM代碼告訴你要如何設定吧！
以TransBiz的網站來說，我們有幾個入口處可以讓造訪網站的使用者訂閱我們的電子報，但如果沒有在後台設定，我們大抵只能知道每天有多少個新的訂閱戶，而無法得知使用者大多是在哪裡訂閱我們的電子報。知道這個要幹嘛？簡單的說，可以看文末的CTA是否有助於提升使用者的訂閱意願，看在Blog頁面的「免費訂閱」是否夠吸引人。
觸發條件設定
代碼設定
比如你想要知道使用者在某個特定瀏覽頁面，看了多少的內容；或者是使用者點了廣告以後，進入的登錄頁面，他們看了多少之後跳出視窗。
觸發條件設定
代碼設定
知道這個可以幹嘛？優化網頁的內容，是不是太冗長、文字、圖片不夠吸引人，也可以搭配Hotjar熱點看人們最常將滑鼠停留在哪裡、停留的時間。
事件裡面通常會有：類別、動作、標籤以及值4個需要寫入的內容。以TransBiz的例子來說，我們想要知道3個個案研究分別被閱讀的比例，又是從哪一個網頁前導頁面來到個案研究，因此可能在事件的命名上會如下：
但如果你要知道的是這三個個案分別被瀏覽的比例，那麼在事件的內容設定可能如下：
非互動事件：為了不要低估跳出率，通常會將值設定為True。
為了不讓你所設定的GTM代碼影響跳出率的計算，我們通常會將非互動事件的值改為「是」。因為如果否的話，它就會認為使用者與你的網站有互動，而當使用者離開網站的時候，不計算跳出率。
舉例來說，若我們在使用者瀏覽網頁25%的時候寫下一筆GTM的紀錄，並且將「非互動事件」選擇「否」值的話，就代表：當使用者瀏覽特定網頁25%的時候，「不是」「非」互動事件→是互動事件（負負得正），所以，只要使用者瀏覽特定網頁達25%的時候，會認定這個使用者與你的網站有互動，所以不計算這個使用者的跳出率。
但事實上，可能瀏覽特定網頁25%的使用者，是對你的內容沒興趣，所以才沒有往下繼續閱讀內容，可是你卻沒有計算到這個使用者在網站上的跳出率，這樣是不是低估了你的跳出率了呢？
想更了解Google Analytics的「事件」，可以參考Google官方提供的事件說明。
如果你的網站商品沒有很多，未來想透過FB pixel再行銷，那麼你就需要將觸發條件設定成FB的像素並加入相關的轉換事件，安裝GTM。
因為Google還沒有跟Facebook很麻吉，所以若要使用Facebook pixel的話，必須自己先安裝Facebook像素 pixel，然後再給予下一步的指令。你可以透過代碼觸發順序設定特定事件，或是重複基本的Facebook pixel 接續特定事件的語法。
要怎麼找到你的Facebook pixel ，可以參考這篇：《Facebook Pixel與FB廣告設定教學全攻略》
如果你曾經裝過FB pixel，現在想要在GTM統一管理，可以參照以下的步驟：
（1）整合Tag Manager
（2） 選擇Google Tag Manager
（3）手動安裝
點開第二個步驟，你會看到特殊事件的代碼
不同的事件設定不同的代碼，可以自己寫入不同的值和幣值
2. 請GTM先讀取Facebook base pixel 基本像素，之後再讀取事件的pixel，在自訂HTML代碼的地方只需要複製Event的代碼就，不需重複輸入Facebook base code。但在代碼設定的進階設定中，代碼觸發順序要先選擇Facebook基本像素。
觸發的條件根據你的設定通常會是瀏覽特定的網頁，比方說加入購物車的網址是 /cart，完成結帳的網址是/order-received。
對於Facebook pixel Event有更多疑問可以參考Facebook官方提供的QA。
設定事件的代碼結果可以在Facebook pixel Event的結果或是Analytics中看到
在Facebook的像素裡，你也可以自己設定特定的事件，讓結果直接出現在Facebook廣告管理的pixel裡。
在你使用GTM的時候，右手邊有一個「預覽」功能
當你回到自己有設定GTM的網站時，就會看到網頁下方出現以下的標記。它會告訴你說，在這個網頁上，它觸發了哪些GTM，以及哪些是沒有被觸發的，你可以透過這個預覽功能來看到自己設定的GTM代碼有沒有成功。
當你要檢查網頁上的變數名稱時，你也可以透過預覽功能看到每一個文字、每一個按鈕的相對應變數名稱。
不過前提是，你要先在GTM的變數設定中，將「內建變數」勾選起來，這樣才能在預覽模式中的「Variables」看到每一個點擊或是動作在網頁上的代稱。
這樣你才可以在觸發條件設定的時候，使用不同的變數名稱，精確地指出使用者在網站上所做的每一個動作，而你想要追蹤哪些動作，透過GTM代碼設定。
當你每次在GTM裡面修改的時候，它會記錄每一個版本，同時修改的人可以透過註記的功能說明每次更改的內容。
如果有不同的協作者在共同管理一個帳號，就能透過紀錄以及「說明」知道每一個使用者在GTM做了哪些事。也可以在不小心搞砸的時候，回復到某一個版本。
關於更多GTM代碼觸發條件的設定，可以參考Google官方的代碼管理工具說明—觸發條件。
前面有提到，你可以透過GTM的預覽功能，看到你所設定的GTM代碼有沒有被觸發成成功。但光是這樣，可能不足以檢查你的資料有沒有在Facebook的後台被寫入。因此你可以使用Chrome的外掛功能「Facebook Pixel Helper」，查看在該網頁中有多少的Facebook像素，是否有埋入成功。
此功能不僅是可以看到自己的網站Pixel，也可以看到任意網頁是否有埋Facebook pixel。綠色的數字是植入Facebook Pixel的數目，點開以後則可以看到pixel的細節。
在這篇文章裡，我們舉了三個例子告訴你在網頁中的特定內容之GTM代碼該如何設定（不同的入口處追蹤、瀏覽網頁百分比追蹤、Facebook事件像素），前提是你要先設定好自己的Google Analytics帳號、有Facebook的粉絲專頁。如果你在設定GTM有更多的疑問，或是想知道其他類型的GTM該怎麼設定，歡迎留言與我們討論。
想瞭解更多跨境電商和行銷相關資訊，歡迎訂閱TransBiz電子報
3 Comments
看不太懂
打開你的Google Tag Manager實際操作以後，再看看有哪裡不懂的地方吧！
但透過GTM使用Facebook pixel 是否仍沒辦法追蹤到轉換值？像是ATC商品的產品售價、Purchase的訂單金額