身為網站站長，看著辛辛苦苦寫的文章，卻不知道到底有多少人看過？網路上常聽到的 Google Search Console (GSC) 和 Google Analytics (GA4) 到底差在哪裡？為什麼明明 GSC 已經有資料了，GA4 卻還是一片空白？其實，這兩套工具的運作原理完全不同！這篇文章將用最白話的方式，帶你一次搞懂它們的差異，並手把手教你如何在痞客邦、Blogger、GitHub Pages 這三個截然不同的平台上，正確埋設 GA4 追蹤代碼。學會這些，你就能真正掌握網站的「流量密碼」，不再讓珍貴的數據溜走！
1. 觀念大解密：為什麼 GSC 有資料，GA4 卻沒有？
很多新手站長在剛開始經營網站時，都會遇到這個大哉問：「我的痞客邦、Blogger 和 GitHub Pages 都已經通過 Google Search Console (GSC) 驗證了，為什麼痞客邦在 Google Analytics (GA4) 裡有資料，但另外兩個卻空空如也？」
要徹底理解這個問題，我們必須先看懂這兩個工具的「資料擷取機制」，這可是有著根本上的差異喔！
🔍 Google Search Console (GSC)：伺服器端與搜尋引擎的對話
當你透過 DNS 紀錄或 HTML 標記驗證了網站所有權，你其實只是在向 Google 宣告：「嘿！我是這個網域的合法主人喔！」GSC 的資料來源，是 Google 的爬蟲（Googlebot）在浩瀚的網際網路上爬梳時，統計出來的「曝光次數」和「點擊次數」。
重點來了：這些搜尋行為是發生在 Google 的伺服器上，而不是你的網站內。 所以，只要驗證通過，你不需要在網站裡寫入任何一行程式碼，GSC 就能把搜尋引擎那邊的「站外」成績單交給你。
📊 Google Analytics 4 (GA4)：用戶端瀏覽器與網站的連線
GA4 的任務則完全不同，它要記錄的是訪客「進入你的網站後」的一舉一動，像是點擊了哪個按鈕、在哪一頁停留了多久、甚至滑動到了多深的位置。這些動作通通發生在訪客的「瀏覽器」裡！
因此，你必須在網站的每一頁的 HTML <head> 區塊內，載入一段專屬的 JavaScript 追蹤代碼（也就是常聽到的 gtag.js）。當有緣人載入你的網頁時，這段腳本就會默默啟動，並發送一個無形的封包（Ping）回傳給 Google 的伺服器，這樣一來，你的 GA 報表才會出現熱騰騰的數據。
這也是為什麼你的痞客邦有資料（因為系統可能已經幫你整合好了代碼），而 Blogger 和 GitHub Pages 卻因為「缺少觸發腳本」而呈現一片荒蕪。別擔心，接下來我們就來一步步把它們裝回去！
2. 第一步：建立 GA4 資源與取得追蹤代碼
在開始為各平台埋設代碼之前，我們得先到 GA4 後台準備好「資源」。這邊強烈建議：因為你同時經營三個性質不同的平台，為了避免未來報表數據混成一團，請務必為每個網站建立獨立的 GA4「資源 (Property)」！
- 登入 Google Analytics 官網。
- 點擊左下角的「管理」（齒輪圖示）。
- 在「資源」欄位中，點擊「建立資源」。
- 進入「建立資源」的詳細資料填寫畫面（步驟 1），請依照以下建議精準填寫：
- 屬性名稱 (必填)：請輸入你想追蹤的網站名稱，例如：「Blogger 旅遊網誌」或「GitHub Pages 專案」。注意：系統規定長度必須介於 4 到 100 個半形字元之間，若未填寫或字數不符規範，下方的「下一步」按鈕會呈現反灰且無法點擊的狀態喔！
- 報表時區：請下拉選擇「台灣」，右側會自動帶出「(GMT+08:00) 台灣時間」。這攸關你報表每天結算的「換日時間」，千萬別選錯了以免數據週期混亂。
- 貨幣：下拉選擇「新台幣 ($)」。雖然部落格可能不直接販售商品，但未來若有設定轉換目標價值，這將會是預設的計價單位。
- 建立完成後，系統會請你設定資料串流，請選擇「網頁」。
- 輸入你的網站網址與好辨識的串流名稱，確認勾選「加強型評估」，然後點擊「建立串流」。
建立成功後，請留意畫面上的兩個關鍵資訊，這將是我們接下來實戰的武器：
- 評估 ID：格式為
G-XXXXXXXXXX（痞客邦與 Blogger 只要填這個就好）。 - 查看代碼指令：點開後會是一段完整的 JavaScript 程式碼（GitHub Pages 需要這整段）。
3. 實戰教學：痞客邦 (Pixnet) GA4 安裝指南
痞客邦的系統架構比較封閉，我們無法隨心所欲地去修改底層的 HTML 原始碼。因此，最穩妥的方法就是利用官方提供的擴充套件。
🛠️ 標準安裝步驟
- 登入你的痞客邦應用後台。
- 點選左側選單的「部落格應用市集」。
- 在搜尋欄輸入「Google Analytics」，尋找「Google Analytics 4 統計工具」並點擊安裝（通常是免費的）。
- 安裝完畢後進入設定畫面，將剛剛複製的「評估 ID (G-XXXXXXXXXX)」貼上。
- 點擊「儲存設定」，打完收工！
⚠️ 工程師悄悄話：痞客邦的潛在限制
大家應該都知道痞客邦版面上常有不少廣告。有時候這些龐大的廣告腳本，會導致 GA4 的追蹤代碼延遲載入。此外，如果你的讀者剛好裝了強大的 AdBlocker（廣告阻擋外掛），GA4 的追蹤訊號也很容易被一起攔截下來。這也就是為什麼，你看到的 GA4 數據有時會比伺服器真實流量少一些的原因。
4. 實戰教學：Blogger GA4 安裝與 XML 避坑指南
Blogger 作為 Google 的親兒子，整合度自然沒話說。它提供了超簡單的欄位填寫，但對於喜歡玩轉佈景主題的進階玩家來說，直接改 Code 才是王道！我們來看看兩種方式：
方法一：超懶人基礎安裝法
如果你是用官方預設的主題，這招最快：
- 進到 Blogger 後台，點左側的「設定」。
- 在「基本」設定區塊裡，找到「Google Analytics (分析) 評估 ID」。
- 直接把你的
G-XXXXXXXXXX貼進去，存檔搞定！
方法二：進階原始碼安裝法（推薦但有坑！）
如果你裝了超酷炫的第三方 Blogger 佈景主題，有時基礎安裝法會莫名失效。這時候你就得自己動手豐衣足食，到「主題」>「編輯 HTML」裡把整段 gtag.js 代碼塞進去。
💣 致命錯誤警告：XML 格式的逆襲！
Blogger 的主題編輯器可是非常嚴格的 XML 格式控！如果你直接把 GA4 的代碼 <script async src="https://..."></script> 複製貼上，Blogger 絕對會亮紅燈報錯不讓你存檔。
💡 破解大法： 在 XML 的世界裡，屬性不能只有名字，必須要「有名有姓（值）」。請手動把那段代碼裡的 async 改成 async="async"。改完再存，保證順利通關！
5. 實戰教學：GitHub Pages 靜態與動態埋碼策略
來到工程師最愛的 GitHub Pages 啦！因為這裡是純靜態網頁的天下，沒有什麼後台介面可以讓你填資料，所以我們必須把完整的追蹤原始碼，親手埋進 HTML 檔案裡。
情境 A：小巧的純靜態 HTML 專案
如果你的專案只是幾個簡單的 .html 頁面（例如一個精緻的履歷表或單頁應用程式），作法很直觀：
- 打開
index.html以及任何你想追蹤的網頁。 - 找到
<head>標籤。 - 把在 GA4 後台複製的整段
gtag.js程式碼，貼在<head>之後、</head>之前的最上方。 - Commit 後 Push 到遠端，等 GitHub Actions 跑完部署就大功告成了。
情境 B：使用 Jekyll 靜態網站產生器
如果你是用 Jekyll 來架設擁有幾十篇文章的部落格，拜託不要傻傻地每一頁都去貼代碼！我們要用更聰明的方法：
- 在你的 GitHub 數據庫根目錄找到
_includes資料夾（沒有就自己建一個）。 - 在裡面新增一個檔案，取名為
analytics.html，然後把整段 gtag 代碼貼進去存檔。 - 接著，去尋找你的「全站共用頭部檔案」（通常會藏在
_includes/head.html或_layouts/default.html裡面）。 - 在那個檔案的
<head>區塊內，加上這句神奇的 Liquid 語法：{% include analytics.html %}。
這樣一來，以後你不管寫幾篇文章，Jekyll 在編譯時都會乖乖地幫你把這段追蹤代碼塞進每一頁裡。未來如果 GA4 升級要換代碼，你也只要改 analytics.html 這個檔案就好，是不是超有效率！
6. 終極驗證：專業級別的連線除錯 (Debugging)
代碼貼完了，心也安了一半，但到底有沒有成功發揮作用呢？很多人會傻傻盯著 GA4 的「即時報表」看，但有時候網路延遲或是快取問題，會讓你等得心急如焚。來！我們教你一招前端工程師的必殺技，直接攔截網路封包驗證！
- 用 Chrome 或 Edge 瀏覽器，打開你已經埋好 GA4 代碼的 Blogger 或 GitHub Pages 網頁。
- 帥氣地按下鍵盤上的 F12（或是按右鍵選「檢查」），呼喚出「開發者工具」。
- 切換到 「Network (網路)」 這個頁籤。
- 在 Filter（過濾器）的欄位裡，輸入
collect或是v=2。 - 接著按下 F5 重新整理網頁。
見證奇蹟的時刻到了！如果你看到清單裡跳出一條向 google-analytics.com/g/collect?... 發送的網路請求，而且 Status（狀態碼）顯示 200 或 204... 恭喜老爺！賀喜夫人！
你可以點擊那條請求，查看裡面的 Payload 資料，如果能找到你的 G-XXXXXXXXXX 評估 ID，就代表這支追蹤封包已經 100% 成功發射到 Google 總部了。從此以後，你就能安穩地坐在電腦前，看著網站流量數據一點一滴累積囉！
