如何在 Shopify 上安裝 Google Tag Manager？

, ,
1

為什麼你該在 Shopify 上安裝 Google Tag Manager？

想像一下：當顧客在你的 Shopify 商店點擊某個商品卻沒結帳，你卻不知道原因？GTM 就像你的數位偵探工具，幫你追蹤用戶行為、設定再行銷廣告，甚至整合 Google Analytics 4（GA4），而且完全不用碰程式碼！以下用最白話的步驟帶你完成安裝👇

安裝 Google Tag Manager 的完整步驟

:white_check_mark: 步驟 1：建立 GTM 帳戶

  1. 進入 Google Tag Manager 官網
  2. 點擊「建立帳戶」，輸入商店名稱（例如：我的品牌電商）
  3. 容器名稱填寫你的 Shopify 網址，平台選「Web」

:light_bulb: 小提醒：容器設定中的「目標廣告平台」可先跳過，之後隨時能加

:white_check_mark: 步驟 2：取得 GTM 安裝代碼

建立帳戶後，你會看到兩組代碼：

<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXX');</script>
<!-- End Google Tag Manager -->

和

<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXX"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>

重點複製這兩段！（GTM-XXXXXX 是你的專屬 ID）

:white_check_mark: 步驟 3：將代碼貼入 Shopify 後台

  1. 登入 Shopify 管理介面 → 左側「線上商店」→「主題」
  2. 點擊「編輯程式碼」→ 在 theme.liquid 檔案中尋找 </head> 標籤
  3. 將 第一段代碼 貼在 </head> 上方
  4. 再尋找 <body> 標籤，將 第二段代碼 貼在 <body> 下方
  5. 儲存後，回到 GTM 介面點擊「提交」發布容器

:white_check_mark: 步驟 4：用 GA4 測試是否成功

  1. 在 GTM 建立新代碼 → 選擇「Google Analytics：GA4 事件」
  2. 輸入你的 GA4 評估 ID（在 GA4 後台的「管理」>「資料串流」中找）
  3. 觸發條件選「All Pages」
  4. 發布後，用 Google Tag Assistant 檢查
    → 看到綠勾就代表安裝成功！

常見問題破解

:red_question_mark: 安裝後數據沒更新？

  • 清除瀏覽器快取或試用無痕模式
  • 確認 GTM 容器已「提交」發布（非草稿狀態）
  • 在 Shopify 主題編輯器預覽模式中測試

:red_question_mark: 需要請開發者嗎？

完全不用！這套方法是 Shopify 官方推薦的無程式碼解法，適合所有使用者。

:red_question_mark: 能追蹤哪些數據？

透過 GTM 可輕鬆監測：

  • 按鈕點擊（例如「加入購物車」）
  • 表單提交（訂閱電子報）
  • 滾動深度（用戶看了多少頁面）
  • 自訂事件（特價活動轉換率）

進階技巧：用 GTM 提升轉換率

試著在 GTM 設定「結帳頁面瀏覽」事件，當用戶進入 /checkout 頁面時觸發，再搭配 Facebook 像素進行再行銷，能有效挽回棄單客戶！

:glowing_star: 小結：安裝 GTM 只要 10 分鐘，卻能解鎖精準數據戰力。現在就動手，別讓流量白白浪費啦！

（附註：若需視覺化教學，可參考 Shopify 官方指南或 GTM 的 YouTube 頻道）