Code For Marketing

GTM (Google Tag Manager)是許多人熟悉但又陌生的詞彙，常常會在你耳邊不斷聽見，但你可能幾乎沒有什麼機會去使用到它，那GTM使用起來到底困不困難呢？今天CFM就帶大家來簡單用『安裝Facebook』轉換追蹤帶大家簡單認識一下GTM的結構吧！

GTM 小簡介：

• • GTM 可以做到很多基礎的事件追蹤，都不太需要用到coding .
  • GTM 是一個對於行銷人來說也能輕鬆操作的工具～
  • GTM 不只可以用來做追蹤，還可以用來處理許多有關轉換追蹤的問題！

---

GTM 的基本架構：

GTM 基本上是透過三個部分構成-

Tags — 標籤：層級最高，可以在標籤這層嵌入想要觸發的代碼。

Trigger — 觸發機制：層級中間，在這個層級設定觸發的邏輯&機制。

Variables — 變數：三者之中層級最低，參與觸發的邏輯元素。

GTM 的運作邏輯：

1. GTM本身其實就是一個容器，為了要讓這個容器運作，我們要將GTM的SDK追蹤碼（跟Facebook Pixel 很像的東西）埋入要使用GTM的頁面，通常會是全站。
2. 埋入後，在沒有透過其他設定的條件下，每當頁面被瀏覽GTM就會啟動，但只是GTM這個『容器』被啟動，就好像是把電腦『開機』但不執行任何程式的『待機』狀態。
3. 將我們需要使用的『工具的追蹤代碼』放入GTM裡，並設定觸發的機制，當達到此條件時，GTM便會啟動該『工具』。

用GTM實作Facebook 轉換追蹤：

Step 1. 取得Facebook Pixel 代碼。

進入Facebook 廣告帳戶 > 點選左邊選單下方的 All tools > 點選Pixel 後會看到以下畫面：

STEP 2.點選下方藍色的觀看設定辦法(view set up instruction)後，會進入選擇如何安裝Pixel的方法。

在這邊簡單跟大家分享一下！Facebook的建議安裝方法一共分為三種方式：

1. 連結到Partner的Platform : 也就是透過第三方的工具來執行安裝，這邊指是透過像是GTM等等其他非Facebook的工具。
2. 人工埋入代碼：直接手動埋入代碼到網頁上。
3. 聯繫你的工程人員：把追蹤代碼寄給你的工作人員。

Step 3. 點選畫面後，會看到視窗內的步驟二提供了一段程式碼，這段就是我們Facebook的Pixel的追蹤代碼！

Step 4. 前往GTM ，並點選左手邊的『標籤』。

Step 5. 點擊下方的Tag Configuration，將追蹤碼貼入Tag 的欄位

Step 6. 將Pixel code 貼入標籤內

Step 7. 貼入完成後，選擇下方的Trigger ，並選擇All Pages.

但在這邊有幾個小地方要注意！！！

Facebook 的pixel Code 其實分為兩個東西：

ㄧ個就是上方我們所看到的程式碼(上方的Pixel Code)，而另外一段則是下方的程式碼

這段程式碼呢，我們稱為『事件程式碼』，簡單說Facebook 的Pixel Code是由兩段程式碼所構成：

1. 基底程式碼：基底程式碼是用來追蹤瀏覽人次、page view等等基本事件，而透過這組代碼搜集的資訊可以應用到廣告的Regarteting !在行銷廣告喔！
2. 事件程式碼：事件程式碼則是用來追蹤『標準事件』以及『自訂的事件』，至於什麼是標準事件、什麼是客製化事件呢？其實標準事件就是Facebook所歸納的一些常被追蹤的『行為』，例如：『點擊』、『加入購物車』等等，當然他也保留了讓大家使用自訂的可能性，這邊未來會再跟大家多做說明！

所以聽到這裡你大概聽明白了，你可以把『基底程式碼』當成程式碼的本體，而『事件程式碼』則是配件，如果只埋入了『事件程式碼』Facebook是不會拿到有關事件的資料，傳遞這些資料需要透過基底程式碼來進行喔！

也因此通常我們會在所有頁面都埋入這段pixel code，並在對應的頁面埋入事件代碼並透過GTM進行觸發，再把資料透過基底程式碼回傳到Facebook的廣告後台囉！

至於事件代碼的追蹤設定我們下回再跟大家分享！

---

8. 完成後點選右上方的保存後，點選測試，畫面會重新reload ，最後回到網站上，檢查Tag 是否已經被Fire !

如果你看到Facebook Pixel 出現在 “Tags Fire on This Page”的地方，則表示你的Tag被成功啟動囉！

Step 9. 最後回到你的GTM ，發布此Tag ，並在回到你網站上，使用Facebook Pixel 的外掛Facebook Pixel Helper 檢查你的Facebook Pixel 是否有被啟動，如果看到他正常啟動那就表示FB能夠正常接收你的資料囉！