Skip to content

GTM 入門介紹 – 如何將 GTM 安裝 到網站?

在上一篇入門介紹中有提到,只要安裝 Google 代碼管理工具,就可以直接透過平台設定及佈署所需代碼,無論是來自 Google Analytics 、 Google Ads 、 Facebook Pixel 或第三方合作夥伴的代碼都包含在內,本篇文章將會帶你認識 GTM 的帳戶架構以及如何安裝 GTM 到網站。

Google Tag Manager 帳戶架構

Google Tag Manager 帳戶架構

GTM 是由帳戶、容器和代碼所組成,一個帳戶可以容納許多容器,每個容器都擁有自己的安裝編號,將容器安裝到網站上後即可將容器內的所有設定及代碼套用至網站上。

在正常的使用狀況下,建議每個公司僅使用一個帳戶,每個網站使用一個容器。即便如此,我們還是會常常碰到公司內不同部門使用不同帳戶,甚至同網站使用多組容器,這最終一定會導致數據追蹤與代碼的衝突;除此之外,隨著代碼的增長,管理分佈在多個帳戶與容器的代碼、觸發器與變數絕對會產生許多的麻煩;所以切記,每個公司使用一個帳戶,每個網站使用一個容器!

開始安裝 GTM

1. 建立/登入 Google 帳戶

在 GTM 帳戶架構中我們有提到 GTM 的安裝編號必須從容器當中取得,所以我們必需先登入 Google 帳戶,接下來才能前往 Google Tag Manager 建立新的 GTM 帳戶與容器並取得容器的安裝編號;GTM 帳戶與容器皆提供完整的使用者權限管理功能,因此在創建 GTM 帳戶和容器後只需將權限開給相關人員即可分享帳戶或容器的內容。

2. 創建帳戶與容器

到達 GTM 後可以看到所有擁有權限的 GTM 帳戶 (預設為空白),點擊右上方”建立帳戶”即可創建新的 GTM 帳戶。

創建新帳戶的同時,必須建立一個新的容器 (之後可以單獨建立新的容器在同帳戶底下),帳戶名稱與容器名稱並不會影響後續使用,建議將帳戶名稱設定為公司名稱,容器名稱設定為網站名稱,以方便日後的辨識;容器的部分目前提供了網路、 iOS 、 Android 、AMP 四種容器種類,可以根據需求選擇相對應的類別,每種容器會有各自不同的代碼可供使用,且在創建之後不能修改容器類別

備註:本篇文章只會針對網路(網站)類別的容器做安裝介紹,其他種類的安裝辦法可以參考官方文件

3. 取得 GTM 容器安裝編號

成功創建容器後可以在容器上方看到容器的安裝編號 GTM-xxxxxxx ,點擊安裝編號即可取得完整的安裝代碼,只需將完整的代碼放進網站源代碼中的 <head> 與 <body> 指定位置即可將 GTM 安裝至網站中。

注意:安裝 GTM 時必須將安裝代碼放進網站中的每一頁,否則將只有擁有 GTM 安裝代碼的頁面能夠正常使用 GTM。

WordPress 網站安裝 GTM

如果你的網站是使用 WordPress 來架設,也可以使用 Google Tag Manager for WordPress 外掛,下載啟用後只需將容器編號(GTM-xxxxxxx)填入並儲存即可完成 GTM 的安裝。

4. 開啟預覽模式,檢查是否安裝成功

這是最後也是最重要的步驟,我們不會希望在開始使用後才發現 GTM 沒有安裝成成功;容器的右上方可以找到預覽按鈕,在正常情況下,我們通常會在代碼發布以前使用預覽功能檢查及測試代碼是否設置正確,在這裡我們也可以使用預覽功能來檢查 GTM 是否成功的安裝在網站上,點擊右上方的預覽,開啟 GTM 預覽功能。

5. 開啟預覽模式,檢查是否安裝成功

開啟預覽功能後,即可測試網站是否已經正確安裝 GTM 容器,如果容器可以和網站連結,表示 GTM 容器已成功安裝到網站。更多有關預覽模式的說明,可以參考 全新 Google Tag Manager 預覽模式完整使用教學

數據顧問服務

數據酷顧問團隊
提供企業專屬的數據解決方案

文章許願池

想看什麼文章主題?
我們會儘快為您安排

數據顧問服務

數據酷顧問團隊
提供企業專屬的數據解決方案

文章許願池

想看什麼文章主題?
我們會儘快為您安排

數據顧問服務

數據酷顧問團隊
提供企業專屬的數據解決方案

文章許願池

想看什麼文章主題?
我們會儘快為您安排

Scroll To Top