【GTM教學】新手篇:十分鐘搞懂Google Tag Manager
文章推薦指數: 80 %
在這邊給大家推薦一個Chrome 的擴充功能Tag Assistant(by Google),我們可以使用這項功能了解是否已經正確且成功地在網站上安裝各種標籤,安裝完成 ...
圖靈數位關於圖靈 認識黃道育圖靈團隊加入我們隱私聲明成功案例服務介紹 服務項目總覽數據整合分析網站數據檢測埋程式追蹤碼企業教育訓練網頁AB測試線上數據報表試用資源 預約顧問諮詢趣味電商測驗數據分析白皮書電商經營大哉問數據攻略 標準GA3新版GA4建置GTM廣告優化區數據新手村導入GA4 導入成功案例導入服務方案導入常見問題導入示範資源導入檢核表單導入統計表現GA4導入檢測… 關於圖靈 認識黃道育圖靈團隊加入我們隱私聲明成功案例服務介紹 服務項目總覽數據整合分析網站數據檢測埋程式追蹤碼企業教育訓練網頁AB測試線上數據報表試用資源 預約顧問諮詢趣味電商測驗數據分析白皮書電商經營大哉問數據攻略 標準GA3新版GA4建置GTM廣告優化區數據新手村導入GA4 導入成功案例導入服務方案導入常見問題導入示範資源導入檢核表單導入統計表現GA4導入檢測預約顧問諮詢圖靈數位關於圖靈 認識黃道育圖靈團隊加入我們隱私聲明成功案例服務介紹 服務項目總覽數據整合分析網站數據檢測埋程式追蹤碼企業教育訓練網頁AB測試線上數據報表試用資源 預約顧問諮詢趣味電商測驗數據分析白皮書電商經營大哉問數據攻略 標準GA3新版GA4建置GTM廣告優化區數據新手村導入GA4 導入成功案例導入服務方案導入常見問題導入示範資源導入檢核表單導入統計表現GA4導入檢測… 關於圖靈 認識黃道育圖靈團隊加入我們隱私聲明成功案例服務介紹 服務項目總覽數據整合分析網站數據檢測埋程式追蹤碼企業教育訓練網頁AB測試線上數據報表試用資源 預約顧問諮詢趣味電商測驗數據分析白皮書電商經營大哉問數據攻略 標準GA3新版GA4建置GTM廣告優化區數據新手村導入GA4 導入成功案例導入服務方案導入常見問題導入示範資源導入檢核表單導入統計表現GA4導入檢測預約顧問諮詢【GTM教學】新手篇:十分鐘搞懂GoogleTagManager·GoogleTagManager你是不是也有以下困擾呢跟廣代合作需要請工程師在網站中埋入追蹤碼,等待工期讓你錯失最佳廣告投放時機?不懂程式的行銷人要埋碼只能雙眼傻看螢幕,懇求工程師幫幫忙,但常遇溝通鴻溝心很累?網站被埋設了成千上萬個追蹤碼,也搞不清楚到底埋了哪些?代碼埋得太多,導致網頁載入的速度很慢,等待的時間令人抓狂?想要查看成效,卻不知道到底哪個追蹤碼有帶來轉換?行銷伙伴的痛苦我們都知道!今天就介紹一個解套的數據分析神器,讓行銷人從一連串複雜的代碼中解放出來,現在就讓我們來認識一下這個工具是什麼吧!目錄一、認識GoogleTagManager二、使用GoogleTag Manager管理代碼優勢 1.簡化埋設網站追蹤代碼的流程 2.提升網站載入的速度 3.減少代碼埋錯的機會三、介紹GoogleTagManager的基本元素 1.Accounts(帳戶) 2.Containers(容器) 3.Tag(代碼標籤) 4.Triggers(觸發器)四、申請GoogleTagManager的流程 1.設置帳號名稱與容器名稱 2.將GTM程式碼貼到網頁原始碼中 3.確保GTM安裝成功 4.串接GA3或是GA4的追蹤代碼一、認識GoogleTagManagerGoogleTagManager(以下簡稱GTM)是一款強大的免費代碼部署工具,你可以將所有需要修改或者更新的代碼上傳至GTM,安裝完成後,網站分析師與行銷人員不用去修改或是更新網站的原始碼,只要透過GTM即能輕易地將各種追蹤程式碼以及第三方應用工具安裝到網站中,讓追蹤和管理都在同一個平台完成。
對於不會寫程式代碼的行銷人而言,GTM簡直就是救星。
使用GTM進行管理,除了可以減少埋碼的人力投入、簡化流程外,還可以降低人為操作失誤,一次看到目前所有代碼的運行狀態。
二、使用GoogleTagManager管理代碼優勢1.簡化埋設網站追蹤代碼的流程簡單來說,GTM就像是哆啦A夢的百寶袋一樣,我們可以把GoogleAnalytics、GoogleAds、FacebookPixel等各式各樣的追蹤代碼,全部都放在裡面統一進行管理,再也不用拜託工程師將這些代碼一個一個的埋到網站後台。
GTM是業界熟悉並通用的工具,因此不管是要跟網站商、工程師、廣告代理商還是數據分析師接洽,都可以有效降低溝通成本。
2.提升網站載入的速度假如你在網站後台埋入大量的追蹤代碼,會增加網頁讀取的時間,但透過GTM管理的代碼則不會被寫入網站的html之中,如此以來就可以加快網頁載入速度,提升使用者體驗,同時優化SEO排名。
3.減少代碼埋錯的機會過去我們直接在網站後台埋碼,若想檢驗網站的埋碼有沒有成功,必須要發布網站後才可以進行測試。
但如果我們今天改用GTM進行安裝管理,便可以在代碼發布前先偵錯,直接就可以進行調整。
若代碼更新有發現錯誤,由於GTM是以版本做紀錄,因此使用者可以還原最初埋設的版本。
三、介紹GoogleTagManager的基本元素GoogleTagManager的基本元素一共包括幾個部分:Accounts(帳戶)、Containers(容器)、Tag(代碼)、Triggers(觸發器)。
1.Accounts(帳戶)帳戶是GTM中最高的層級,通常情况下每個公司只需要一個帳户。
一個帳戶可以用來管理一個或多個電商網站,一般來說一家公司只需要一個帳戶,便可管理旗下所有電商網站。
如果有多個網站要安裝各自的代碼,可以創建多個容器(containers)。
這樣就可以同時追蹤不同公司的行銷成效。
若需創建新帳戶,可按下GTM頁面右上的「建立帳戶」如上圖。
2.Containers(容器)容器是專門放置代碼標籤(Tag)的地方,一個帳戶中至少會有一個容器,而一個容器一般來說會對應一個網域,對應的容器可以存放多組代碼標籤(Tag)跟觸發器(Trigger),因此就不需要在每個網頁都放入程式追蹤碼。
如果要新增容器,可點一下齒輪符號選擇「建立容器」3.Tag(代碼標籤)網站後台新增各種追蹤代碼的最終目的,就是要收集用戶的特定行為進行數據的判讀與分析,這些片段的程式碼各自具有不同的用途,最常見的用途就是回傳訊息。
當我們在不同的行銷活動上進行標記時,程式碼會將其接收到的訊息回傳至第三方工具,用來分析行銷活動的成效,而這些負責收集相關訊息的程式碼就被我們稱作代碼標籤(Tag)。
新增標籤(Tag)的方式如下:在「容器」中選擇「新建代碼」,如下圖。
代碼標籤(Tag)的追蹤類型有以下幾種:事件、交易、計時、裝飾連結、裝飾表單。
4.Triggers(觸發器)Triggers(觸發器)定義代碼被觸發的規則,其中的觸發條件是由變數(Variables)、運算符號(Operators)與值(Values)所組成。
一般的運作模式如下圖,我們會設置觸發事件,告訴系統在什麼情況下可以開始收集資料。
【觸發條件類型】使用者可以根據想要追蹤的目標選擇類型,例如:網頁瀏覽、網頁點擊、網頁元素可見度、網頁表單提交、網頁紀錄變更、JavaScript錯誤、網頁捲動、網頁計時器、網頁影片(例如YouTube)、自訂觸發事件等等。
【變數Variable】變數是定義觸發條件執行的規則,告訴代碼標籤該在什麼時候回傳訊息。
而變數又可以細分為內建變數(Built-inVariables)與使用者自訂變數(User-definesVariables)兩種。
內建變數是系統預設,有相當多種常用的觸發方式,比如點擊類別(ClickClasses),你只要簡單點選即可啟用;而使用者自訂變數是我們根據需求特別定義的變數,比如購買完成(purchaseComplete),當成功進行交易後才回傳資料。
【運算符號Operator】運算符號定義變數與值之間的關係,讓系統用來判斷觸發條件的狀態(true或false),兩者之間一定要對應上才能確保觸發條件順利運行,最常見的運算符號如等於(equals)、包含(contains)、或未包含(doesn’tcontains)。
【值Value】明確定義變數的內容,比如出現特定數字或是網頁網址,便會觸發代碼標籤收集資訊。
一個容器可能會含有一個「標籤」和「觸發條件」來記錄特定行為,假如我們想要評估使用者對這個頁面內容感興趣的程度,我們可以觀察用戶平均的網頁捲動深度,可以參照「網頁捲動頁數」觀察使用者看到哪裡,並設置觸發條件,這樣我們就可以收集到該部分的資訊囉!・觸發條件:當使用者的網頁卷動深度達到50%。
・代碼標籤:滾軸深度事件50%。
四、申請GoogleTagManager的流程了解了GTM是什麼以後,現在就開始來實操吧!1.設置帳號名稱與容器名稱進入GTM後,先創建帳戶,再來是創建容器名稱,最後將要監測該網站的所有代碼添加到剛剛命名的容器中。
2.將GTM程式碼貼到網頁原始碼中創建完成後,GTM會提供一段代碼,將代碼埋入要追蹤的網站頁面原始碼
3.確保GTM安裝成功在這邊給大家推薦一個Chrome的擴充功能TagAssistant(byGoogle),我們可以使用這項功能了解是否已經正確且成功地在網站上安裝各種標籤,安裝完成後啟動,重新刷新頁面就可以看到是否有跑出來相對應的代碼,到這裡就大功告成啦!4.串接GA3或是GA4的追蹤代碼請參考另外筆者所撰寫的數據新手村,裡面有詳細的步驟教學喔!總而言之,GoogleTagManager是一個功能強大的標籤管理工具,可以幫助你快速的更新或新增網站上的代碼,尤其是對於正在導入GA4的用戶來說,如果想要追蹤網站的事件,用GTM進行管理會方便許多,假如你對新版GTM感興趣,但是在導入的過程當中碰到問題,或是不知道該如何自訂報表,歡迎填寫【詢問表單】或是直接在右下角【私訊我們】,我們隨時都有分析師在線上協助支援,請不要客氣!大膽地提出你的問題!更多GA教學相關閱讀:【GoogleAnalytics】【網站分析】GA數據有落差?釐清網站數據不準確的7個原因【工具介紹】新的測試功能-計算過的指標BETA【工具介紹】簡介新插件AUTOTRACK【工具介紹】跨網域追蹤【GoogleAnalytics4Property】【GA教學】2021新版GA4完全攻略,從新舊比較到自訂報表都OK【安裝教學】安裝新版GA4,歡迎來到跨裝置的思考領域【全新功能】新版GA4竟能預測使用者行為?五大優勢提高轉換率【一表看懂】新版GA4與舊版GA差在哪裡?新舊版本功能比較懶人包【新版介面】新版GA4的後台介面更新和操作介紹【自訂報表】新版GA4設定自訂報表解說,省去每次整理數據的時間【跨網域追蹤】新版GA4設定跨網域,一次收集多個網域的數據【目標對象】新版GA4如何串接GoogleAds,進行再行銷廣告【組成事件】比較新舊GA的事件追蹤方式,讓你從舊版輕鬆轉移到新版【自訂事件】新版GA4如何自訂事件,讓你追蹤使用者的特定行為【修改事件】新版GA4事件設定錯誤?帶你直接在後台修正回來【測試事件】新版GA4如何利用DebugView測試尚未發布的事件【建議事件】新版GA4官方建議事件清單說明與教學,一次就上手【事件匯入】新版GA4上傳離線事件,讓你整合線下資料【實作教學】新版GA4電子商務事件,新舊差異與purchase轉換【使用者屬性】新版GA4自訂使用者屬性與User-ID教學,輕鬆掌握每位使用者的特徵【報表教學】新版GA4實作「探索報表」,帶你自訂來源/媒介報表【報表教學】新版GA4實作「同類群組分析報表」,帶你找出使用者對短期行銷活動的反應【排除參照連結】新版GA4設定,讓你排除不適用參照連結的金流【GoogleTagManger】【新手教學】十分鐘搞懂GoogleTagManager【實際應用】【實際應用】評估社交媒體渠道【實際應用】善用區隔,找到更「值」的受眾訂閱上一篇善用GA區隔,找到更「值」的受眾下一篇【網站分析】GA數據有落差?釐清網站數據不準確的7個原因! 返回網站提交取消所有文章×快要完成了!我們剛剛發給你了一封電郵。
請點擊電郵中的鏈接確認你的訂閱。
好的聯系我們聯系我們
延伸文章資訊
- 1Google Tag Assistant 使用教學
Google Tag Assistant 是一個Chrome 的擴充工具,並可以拿來檢查Google 其他產品的串接是否有成功導入,例如:Google Analytics、Google Ads、...
- 2使用Tag Assistant幫您驗證GA追蹤碼是否正確安裝。
Google Analytics (dc.js); AdWords Conversion Tracking; AdWords Remarketing (legacy); AdWords Rema...
- 3全新Google Tag Manager 預覽模式完整使用教學 - 數據酷
開始使用新版GTM 預覽模式. 開啟預覽模式; 預覽模式版位介紹 ; 安裝Tag Assistant 外掛. 預覽iframe 頁面; 預覽手機瀏覽器大小 ; 你知道開啟預覽模式會自動 ...
- 4Tag Assistant測試教學-
Tag Assistant測試教學 · 1.到Google線上應用程式商店搜尋【Tag Assistant】後,點選【加到CHROME】 · 2.安裝完成後,會有一個藍色笑臉標籤出現在Googl...
- 5Google Tag Manager 設定教學(二) - 使用Tag Assistant 檢查 ...
安裝Tag Assistant (by Google) · 1、在Chrome 線上應用程式商店搜尋Tag Assistant ,點選加到Chrome. 點選加到Chrome · 2、安裝後右上...