WordPress中安裝Google Tag Manager追蹤碼

Google Tag Manager Haran 1年前 (2021-11-26) 702次瀏覽 0條留言

這一節介紹如何在Wordpress架設的網站上安裝Google Tag Manager,其實安裝過程是非常簡單的。

創建容器

前往 Google Tag Manager代碼管理工具,並使用你的Google 帳戶登入,在Google Tag Manager中的賬戶右側點擊三個點,然後點選“建立容器”:

WordPress中安裝Google Tag Manager追蹤碼

然後會進入建立容器的界面,做如下設置:
WordPress中安裝Google Tag Manager追蹤碼

容器名稱:就是容器的名稱,為了便於區分,一般用網站的域名,我這裡是www.haranhuang.com

目標廣告平台:就是要安裝的目標廣告平台類型,一種有5種,根據實際情況去選擇,我這裡是網站,所以選擇“網路”

  • 網路:就是網站類型
  • iOS:就是iOS應用程式
  • Android:就是Android應用程式
  • AMP:谷歌的AMP
  • Server:伺服器標籤追蹤

設置好後點擊“建立”就會創建容器。

獲取Google Tag Manger追蹤碼

創建好容器後就獲取Google Tag Manager的追蹤碼,打開容器,點擊“管理”—“安裝 Google 代碼管理工具”:

WordPress中安裝Google Tag Manager追蹤碼

這個就是Google Tag Manager的追蹤碼,可以看到Google Tag Manager的追蹤碼是有兩段,一段要求安裝在head裡,一段要求安裝在body。

一般是按官方的要求安裝,當然,你可以將兩段追蹤碼都安裝到head裡也是可以的。

安裝Google Tag Manger追蹤碼

安裝的方法有多種,我這裡介紹兩種:

非外掛安裝

非外掛安裝是通過佈景主題去安裝,在WordPress裡點擊“外觀”—“佈景主題”:

WordPress中安裝Google Tag Manager追蹤碼

然後在右側的佈景主題檔案找到佈景主題首頁(header.php)

WordPress中安裝Google Tag Manager追蹤碼

Google Tag Manager的兩段追蹤碼按要求安裝,一段到head裡,一段在body裡。

然後點擊底部的“更新檔案”就可以了。

外掛安裝

外掛安裝就是通過外掛去安裝,在WordPress裡點擊“外掛”—“安裝外掛”,然後搜尋“Google Tag Manager”,就可以看到:WordPress中安裝Google Tag Manager追蹤碼

點擊“立即安裝”後點擊“啟用”,將GTM的容器ID“GTM-TCH6XWZ”複製到如下位置:

WordPress中安裝Google Tag Manager追蹤碼

最後是點擊“存儲設定”就完成了。

 

注意:一般不推薦用外掛安裝,因為外掛安裝越多,會影響網頁的加載,打開。

驗證安裝

安裝後,需要驗證Google Tag Manager追蹤碼是否安裝準確。

在驗證之前,先需要在Google Tag Manager容器發佈一個版本,這樣Google Tag Manager追蹤碼才能正常加載,點擊右上角的“提交”就可以發佈版本:

WordPress中安裝Google Tag Manager追蹤碼

 

然後就可以去驗證,這裡介紹兩種方式去驗證:

  • Chrome開發者工具
  • GHOSTERY

Chrome開發者工具

打開Chrome開發者工具,找到Network,在Filter裡用“GTM-”過濾:

WordPress中安裝Google Tag Manager追蹤碼

可以看到GTM的請求是正常加載,狀態是200表示加載成功,也就是Google Tag Manager追蹤碼安裝成功。

GHOSTERY

GHOSTERY是Chrome的Extensions,所以需要在Chrome裡安裝後才可以使用它。

使用方法是先打開網站www.haranhuang.com,然後打開GHOSTERY,它就會顯示這個網站安裝了哪些第三方程式:

WordPress中安裝Google Tag Manager追蹤碼

可以看到有Google Tag  Manager ,就表示Google Tag Manager追蹤碼安裝成功。


如果您在操作上仍有任何疑問,歡迎留言交流。

轉載請註明標題:WordPress中安裝Google Tag Manager追蹤碼
網址鏈接:https://www.haranhuang.com/wordpress-install-google-tag-manager.html

Like (0)
發佈我的留言
取消留言
表情 贴图 加粗 删除线 居中 斜体

Hi,*为發佈留言必須填寫。

  • 顯示名稱*
  • 電子郵件地址*
  • 個人網站網址