搜尋

安裝 GA4 資料收集代碼

如果已經建立了 GA4 的資料收集代碼,就可以開始將追蹤的程式碼放入網站頁面裡,這篇教學會介紹如何透過 gtag.js,將 GA4 資料收集代碼放入網頁中。

快速導覽:

取得並安裝 GA4 資料收集代碼

進入建立的 GA4 資源,點擊管理進入管理畫面,選擇「資料串流」,點擊「網站」選項,準備建立收集網站串流資訊的程式代碼。

GA4 ( Google Analytics 4 ) 教學 - 安裝 GA4 程式碼 - 選擇「資料串流」,點擊「網站」

輸入網址和名稱,點擊「建立串流」。

GA4 ( Google Analytics 4 ) 教學 - 安裝 GA4 程式碼 - 建立串流

完成後就會建立一筆資料串流。

GA4 ( Google Analytics 4 ) 教學 - 安裝 GA4 程式碼 - 建立一筆資料串流

點擊該筆資料串流,開啟串流設定畫面後捲動到最下方,點擊「查看代碼操作說明」。

GA4 ( Google Analytics 4 ) 教學 - 安裝 GA4 程式碼 - 查看代碼操作說明

開啟「安裝操作說明」畫面,點擊「手動安裝」頁籤,就能複製要放在網站中的資料收集代碼,並將這些資料收集代碼,按照說明放在網頁的 HTML 中 ( 參考:HTML 教學 )。

GA4 ( Google Analytics 4 ) 教學 - 安裝 GA4 程式碼 - 複製要放在網站中的資料收集代碼

測試 GA4 資料收集代碼

參考下方範例程式碼,將資料收集代碼放入網頁 HTML 裡,可以使用 JS Bin 的線上網頁編輯器進行測試 ( 參考「使用測試網頁」)。

如果要使用 GTM 安裝 GA4 代碼,可以參考:GTM 安裝 GA4 追蹤代碼

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>

  <!-- Google tag (gtag.js) -->
  <script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXX"></script>
  <script>
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());
    gtag('config', 'G-XXXXXX);
  </script>
</head>
<body>

</body>
</html>

網頁開啟後,應該就能在 GA4 資源的「首頁」裡,看到過去 30 分鐘的使用者出現「1」個使用者,這也表示資料收集代碼已經順利安裝成功。

  • GA4 的「即時」通常可能會有三十秒到一分鐘左右的延遲。
  • 要正確執行代碼,不能單純開啟網頁,而是要在本機環境啟用一個網頁伺服器,或使用 JS Bin 的線上網頁編輯器進行測試 ( 參考「使用測試網頁」 )

GA4 ( Google Analytics 4 ) 教學 - 安裝 GA4 程式碼 - 測試 GA4 資料收集代碼 ( 網站 )

查看 GA4 資料串流評估 ID

如果要查看 GA4 資料串流評估 ID,可以從「管理 > 資源 > 資料串流」裡,點擊想要查看的資料串流。

GA4 ( Google Analytics 4 ) 教學 - 安裝 GA4 程式碼 - 測試 GA4 資料收集代碼 ( 網站 )

點擊欲查看的資料串流後,就能看查看或複製評估 ID。

GA4 ( Google Analytics 4 ) 教學 - 安裝 GA4 程式碼 - 測試 GA4 資料收集代碼 ( 網站 )

小結

雖然通用版本 GA 資源可以自動連結到 GA4 的資源,但在資料收集代碼的格式仍然有所不同,因此如果要完全導入 GA4,建議要將資料收集代碼進行更新,避免資料收集不完整或沒有收集到正確資訊的狀況發生。

意見回饋

如果有任何建議或問題,可傳送「意見表單」給我,謝謝~

GA4 教學

介紹與設定

GA4 教學導讀 認識 GA4 通用版 GA 與 GA4 的差異 建立 GA4 分析資源 安裝 GA4 資料收集代碼 刪除/還原/移動帳戶資源

快速開始&測試

設定輔助程式 使用測試網頁 啟用示範帳戶

使用 GTM

認識 GTM 開始使用 GTM GTM 與 gtag.js 的差異 加入 Google 代碼 加入 GA4 事件代碼 設定觸發條件 設定變數 安裝 Facebook 像素

事件

加強型評估事件 自動收集事件 建議事件 自訂事件 修改與建立事件 標示轉換事件 設定轉換事件價值 設定電子商務事件

資料收集

啟用 Google 信號 使用 User-ID 建立目標對象 使用 DebugView 測試 資料&報表篩選器 資料保留期限&更新間隔 跨網域追蹤 使用 UTM 收集資料 Measurement Protocol 資料匯入 共用及匯出報表 連結 Search Console

資料解讀

認識維度和指標 自訂維度和指標 使用者屬性 工作階段&互動工作階段 參與度&跳出率 使用者&新使用者

報表

集合&主題&報表 首頁 深入分析 自訂報表、主題和集合 報表數據匯報 即時報表 到達網頁報表 網頁和畫面報表 事件報表 轉換報表 獲取新客報表 流量開發報表 電子商務購買報表 使用者購物歷程報表 回訪率報表 客層詳情報表 技術詳情報表

探索

認識探索報表 設定探索報表 任意形式 同類群組探索 漏斗探索 區隔重疊 路徑探索 使用者生命週期 使用者多層檢視

廣告&歸因

歸因模式&歸因分析 廣告數據匯報 所有頻道成效報表 模式比較報表 轉換路徑報表

實際應用

同時使用多組資料串流 追蹤 Email 開信率 追蹤網頁捲動高度 追蹤網頁元素點擊 觀察特定頁面成效 篩選並排除內部流量

GA4 認證考古題

如何進行與準備認證 考題 - 設定&觀念 考題 - 事件&維度&指標 考題 - 報表&探索&廣告 考題 - 其他