【Google Tag Manager基礎教學】找對追蹤碼,安裝GTM沒煩惱

GTM是什麼?

簡單說的話,GTM是一個程式碼集中處,完成安裝後,你可以把新增的追蹤碼、GA事件等等程式代碼放入其中,就會替你自動更新到網站上面!

以前是如何植入代碼?

過往如果行銷人員想要在網站上植入FB像素、Google analytics、hot jar等等的追蹤軟體,每次的更新都需要特地請網站工程師執行,一來一往不只是造成別人工作上的累積,還需要等待排程才可以完成。萬一這之中又突然有代碼需要修改或追加,就只會形成一個沒有效率的工作模式。

Google Tag Manager誕生!

為了解決這個通病,Google 創建了Google Tag Manager這個工具,只要在網站中植入1次GTM的代碼,就可以將GTM中設定的代碼通通植入網頁中。這使的操作人員不僅僅降低了修改網站的不便度,GTM中也內建了許多預設參數及觸發條件,讓設置代碼這件事有了飛躍性的簡單化。

單然,GTM雖然內建了許多方便的功能,但操作人員仍然需要學習介面的操作方法,以及一些代碼的基礎觀念,對於想要了解GTM操作手冊的人,可以看這篇文章。

 

GTM申請流程

1.首先需要前往Google Tag Manager,讓GTM與妳的Google帳號綁定再一起

接下來你會看到一乾淨的畫面,請點選「建立帳號」到下一步

GTM-創建帳號

2.到下一個頁面以後,根據上面需求的資料,填寫帳戶名稱及網址
(帳戶名稱為區分用途,主要是為了管理多網站的行銷員可以立刻區分帳戶,因此有該欄位需要填寫)
送出後會有一份「Google 代碼管理工具服務合約條款」,確認完以後按”是”就可以囉

3.接下來妳就會進入到GTM的操作畫面,畫面上的元素很多,但沒關係,我們先將功能方面略過,若後續有興趣了解GTM的介面功能,可以參考該篇內容。
回到畫面,請找到圖片中紅框中的代碼,這個就是妳的GTM追蹤代碼,請先記住這個東西。

GTM-確認代碼

GTM安裝步驟

依據你的網站,GTM會有不同的安裝方法,以下以各種以兩種情境分別介紹

企業自架網站/客製化網站安裝GTM方法

有些公司在最初網頁建置的過程中,廠商沒有先替客戶創建GTM並安裝,或是預先留下欄位,讓客戶填寫追蹤碼。因此遇到這個情況,只能請公司的工程師,或是當初建置網站的廠商,再另外將代碼直接植入網站中。

GTM-確認代碼

回到剛剛GTM的管理頁面,請點下紅框的文字以後,就會彈出如下圖的視窗,這個就是GTM的管理代碼,只需要依照上面的敘述,將代碼放置在網站的正確的位置中,就可以完成囉。

GTM-完整植入碼

開店平台安裝GTM方法

目前經手的開店平台,如shopline、cyberbiz等等的開店平台,都已經預先創建好專門的空格給客戶填寫GTM追蹤碼。如果仍然遇到困難的話,建議可以直接連絡客服,或是搜尋「(開店平台名稱)+GTM」,就可以找到官方的安裝手冊,跟者做就可以完成了。

wordpress安裝GTM步驟

而wordpress的話則沒有內建的欄位可以填寫,通常有兩個方法可達到目的

1.將代碼直接植入wordpress後台之中

讀者可以GTM的代碼,直接植入「佈景主題檔案編輯器」的檔案內。但該方法比較不適合不熟悉後台的操作人員外,也有可能使前台崩潰的風險。因此建議請專業人員處理,或是採取2號方案會比較安全一點

2.下載wordpress外掛

wordpress有許多免費公開的外掛可以使用,在安裝GTM上,我會建議讀者可以安裝「GTM4WP」或是「Site Kit by Google

兩個外掛都有各自的優點,這篇將會以GTM4WP安裝為主,若想了解Site Kit by Google的操作方法,往後有時間再介紹。

1.首先,請在wordpress後台中,左方的目錄內選擇”外掛”->”安裝外掛”,並在右上角搜尋GTM4WP,選擇與圖內一樣的外掛後安裝並啟用。

尋找GTM4WP外掛

2.接下來,請選擇左方目錄的”設定”->”Google Tag Manager”,在下方的「Google 代碼管理工具容器 ID」中,填寫GTM追蹤碼,並勾選紅框內的選項後儲存,就可以完成囉。
而上方仍然有許多額外設定,增加GTM操作的方便性,這個就等到未來有機會再一一介紹。

GTM4WP設定

3.最後等待大約3~4分鐘,回到GTM管理畫面,點選右上角的”預覽”,會出現下圖的畫面,這邊意思是說”是否要用GTM-XXXXX這個容器測試輸入的網站”。
只要將你的網址填入框內,並按下連結即可開始測試。

GTM-測試功能

如果你的畫面出現像下圖一樣,紅框內是你剛剛填入的GTM代碼,哪就恭喜你安裝成功囉!

但更好奇的讀者可能會發現,下面怎麼有”GA4追蹤代碼”及”GA通用版追蹤代碼”的字樣,這個就是會需要另外再設定,才可以安裝google analytics的追蹤。有興趣了解的話,可以接者閱讀GA安裝步驟。 

GTM-預覽結果

看完了這麼多,我想你對GTM安裝步驟已經有了一定的了解,如果還希望吸收更深入的知識,可以繼續閱讀一下文章:
建立GA4轉換事件!設置GTM事件追蹤完整圖文流程教學
【GA4安裝教學】利用GTM輕鬆植入GA4追蹤碼!
【GTM基礎教學】代碼、變數、觸發條件三大要件說明

如果喜歡的文章,或是未來想要了解更多關於SEO的消息,請關注我的網站,我會努力將各種知識分享給各位:)

 

取自日文「實驗室(じっけんしつ、jikkensitu)」,在自己的網站上做一些實驗性的修改、優化,同時將這份「自己的所見所聞」分享給所有人,在兩個想法的結合下「己見室」就這麼誕生了。 未來會持續以自身經驗、實際操作過的步驟,帶給各位SEO、數位行銷領域相關的優化方法,請各位持續關注這個網站。

Comments

No comments yet. Why don’t you start the discussion?

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *