5 分鐘學識 Google Tag Manager 教學,零 coding 技巧

Google-Tag-Manager-教學

我們常被問到要從哪裡入手開始做 Digital Marketing,綜合了多年協助初創公司工作的經驗,我們會建議首先看這篇安裝 Google Tag Manager 教學 ( GTM ),隨後加入追蹤碼 ( Tracking code ) 例如 google analytics 等,這樣便可了解進入你網站的客人是什麼背景及在網站中做了什麼行為,無需做市場調查也可大約知道市場反應。

網站有很多基本追蹤碼要裝上,例如 Facebook pixel、Google Analytics 等非常實用的追蹤碼。今次文章會介紹安裝強大工具 Google Tag Manager 教學,裝上後 GTM 可以更方便把其他追蹤碼放入你的網站,而且是無需 coding 技巧,跟著我們教學一步一步就可以完成!而在開始 gtm 設定前,建議先安裝 google tag assistant 的 chrome extension , 方便檢查 gtm 設定是否成功。

如果你搜尋 Facebook pixel、Google Analytics 如何安裝,會直接讓你把相應的追蹤碼放到網站中,步驟需要涉及到 IT 同事幫助,所需時間延長。而如果有多個追蹤碼要安裝到網站時,不但令你的網站速度降低,而且直接影響網站的 SEO 排位。Google Tag Manager 可以想像成一個大背包,而追蹤碼是你的隨身物品,把隨身物品放到背包中便可方便了整理它們的過程,而且安裝後你可自行加入想要的追蹤碼無需經 IT 同事。

安裝 Google Tag Manager 教學

開啟 / 申請帳號

首先你要用 Google gmail account 到 GTM 網站開啟一個帳號,於右上角按 “ Star for free “ 進入 GTM 內,然後輸入你網站的資料,如公司名、地區、網址等,最後選擇相應目標平台,如無特別可先選擇 “ website ” ,便可以創建帳戶,最後接受相關條款細則。

Google-Tag-Manager-new-ac
按右上方的 "Start for free" 建立 GTM 帳號
Google-Tag-Manager-setting
輸入網站資料,如無特別可先選擇 “ website ”

安裝 GTM 追蹤碼

創建帳號後,會提供一個 GTM 的程式碼,要裝上 GTM 的程式碼有兩個方法,一是直接找 IT 同事處理,二是如果你用 WordPress 便可使用 Plugin ” Google Tag Manager for WordPress ” 把 GTM 的編號 GTM-XXXXXXX 貼上再儲存就可以短時間內完成安裝。

Google-Tag-Manager-code
創立帳號後,會得到 GTM code 並需要放到網站內,可直接交給 IT同輸處理
Google-Tag-Manager-plugin
WordPress 可直接使用 Plugin 處理

如何使用 Google Tag Manager 教學

重回 GTM 的網站帳戶,然後按新增代碼會彈出一頁有 “代碼設定” 及 “觸發條件”
按到 “代碼設定” 會有多個選擇,可以按自己的要求選擇所需代碼,而 Facebook Pixel、Heatmap 等可選擇 “自訂 HTML”再自行貼上相應追蹤碼。

“觸發條件” 意指要在什麼情況下啟動 “代碼設定” 內的追蹤,例如客人瀏覽指定網址、進入購物車或是付款行為,一般情況下我們首先選擇 “All Page“ 讓你的追蹤碼在每一頁都會觸發。

當完成以上步驟可以更改名稱後儲存,最後按右面的 “提交” ,會彈出一頁可以把它們跳過然後發佈。

Google-Tag-Manager-start-to-use
按入 "新增代碼" ,開始自己加入追蹤碼
"代碼設定" 中有多個選擇,你可挑選加入相關追蹤碼

檢查 gtm 設定是否成功

先在 Chorme 上安裝 Google Tag Assistant 的 Extension,這樣你便可以確認 gtm 設定是否正確。

如何使用 Google Tag Assistant

安裝 Tag Assistant 之後,您會在 Chrome 的右上角看到一個小圖,顯示目前瀏覽的網頁上追蹤標記的狀態。標記會有幾個顏色顯示網頁的追蹤碼是否正常運作,以下是各種顏色代表的狀態:

  • 綠色標記+數字:追蹤標記運作正常
  • 藍色標記+笑臉:網頁上沒有追蹤標記或 Tag Assistant 尚未啟動
  • 藍色標記+數字:您的追蹤標記有點小問題
  • 黃色標記+數字:您的追蹤標記有問題
  • 紅色標記+數字:您的追蹤標記有嚴重的問題

點擊小圖可以打開一個視窗,裡面顯示了有多少標籤被發現,多少錯誤被偵測。點擊訊息可以看到相關的資訊,如果有錯誤,Tag Assistant 還會提供我們修正的建議。

google tag assistant step 1
按下右上角 icon 彈出視窗再按 record
google tag assistant step 2
瀏覽網站後, Tag Assistant 會顯示結果
google tag assistant step 3
Stop Recording 後可得到更仔細報告

這樣便完成 GTM 設定的步驟。希望透過簡單教學,令你可自行安裝這個強大工具,日後對你管理及改善網站都有很大幫助,歡迎定期閱讀我們的文章,幫助你對 Digital Marketing 有更清晰的了解!