行銷數據分析必備,GA4 + GTM 手把手設置教程

逐步引導你如設置 Google Tag Manager 並同時串連最新的數據分析工具 GA4,以達到追蹤網站流量的目的

行銷數據分析必備,GA4 + GTM 手把手設置教程

剛開始了解 Google Analytics,想必是對架設網站及行銷有興趣,本篇文章直擊重點,逐步引導你如設置 Google Tag Manager 並同時串連最新的數據分析工具 GA4,以達到追蹤網站流量的目的


Google Tag Manager 是什麼 ?

要想安裝追蹤網頁數據的工具,不外乎就是在網站中安裝程式碼至特定段落,如果是以前,可能得透過工程師完成;但在人人都能製作網站的現在,早以有許多不需要懂程式,按步驟即能輕鬆設置的方式,Google Tag Manager 即是幫你「 統一管理標籤代碼 」的服務

Google Tag Manager 安裝步驟

GTM → 建立帳戶
  • 建立帳戶名稱,同時輸入容器網址 ( 即你要追蹤的網頁 ) – 你可以建立多個帳戶,也能同時用該帳戶追蹤多個網頁
建立帳戶、設置容器 
  • 服務使用同意書,點選同意 ( Yes )
Google Tag Manager Terms of Service Agreement
  • 會跳轉出現該畫面,此處分別複製程式碼,安裝於網頁中的 <head> <body> 結構中
  • 如果你是 Wordpress 用戶,記得先安裝 Headers and Footers ( 插件 )
Insert Headers and Footers

Google Analytics 設置流程

  • 左下角 admin → Account Setting → Create Property
  • 建立資源 ( Create Property )
  • 回答網站基本資訊
  • 資料串流選擇 網站 ( Web )
  • 設定網頁串流
  • 複製顯示的追蹤碼 ( 評估 ID ),應為 G- 開頭
GA4 評估 ID
  • 回到 Google Tag Manager,新增代碼選擇「 GA4 設定 」
GTM - 代碼設定
  • 代碼設定完成後,記得點選「 送出 」後 GTM 才會更新代碼
  • 設定成功,顯示網頁串流資料

現在安裝 GA4 其實不需要太多的步驟,五分鐘以內就能搞定,是想做就可以馬上完成的事情,你都要開始建立自己的網站或個人品牌了,了解這項工具,並曉得如何設置它,絕對必須了解的基本

.post-content h2, .post-content h3 { outline: none; } body { overflow: visible; } .post-full-content { display: grid; grid-template-columns: 1fr 0.2fr; padding: 0 0 6vw; margin: 0; } .toc-container { order: 1; } .toc-container .toc { position: sticky; top: 70px; min-width: 260px; font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Open Sans, Helvetica Neue, sans-serif; font-size: 1.6rem; line-height: 1.6em; padding: 0 0.8em; } .is-active-link::before { background-color: #3eb0ef; } ol.toc-list { margin: 0; }