設定及安裝「代碼管理工具」

Install the Google Tag Manager container snippet

只要安裝 Google 代碼管理工具,您就可以設定及部署代碼,無論是來自 Google AdsGoogle Analytics (分析)Floodlight第三方合作夥伴的代碼都包含在內。大致步驟如下:

  1. 前往 tagmanager.google.com 建立帳戶,或使用現有帳戶  (系統預設會建立一個新容器,您可在每個帳戶中建立更多容器)。
  2. 在您的網站或行動應用程式中安裝容器
    1. 一般網頁和 AMP 網頁:按照代碼管理工具指示新增容器片段,然後移除所有現有代碼。
    2. 行動應用程式:使用 AndroidiOS 專用的 Firebase SDK。
  3. 新增及發佈代碼

「代碼管理工具」帳戶代表機構組織的最頂層。一般來說,一家公司只需要一個帳戶,「代碼管理工具」帳戶含有一或多個容器,其中有特定的容器類型可用於網站、AMP 網頁、Android 應用程式和 iOS 應用程式。

建立新帳戶和容器

  1. 在「代碼管理工具」中依序按一下 [帳戶] 然後 [建立帳戶]
  2. 輸入帳戶名稱,並視需要指明是否要以匿名方式與 Google 和其他使用者共用資料。
  3. 按一下 [繼續]。
  4. 輸入說明性的容器名稱,然後選取內容類型:網頁、AMPAndroidiOS。若要設定行動容器,請選擇您要使用 Firebase SDK 還是其中一個舊版 SDK
  5. 按一下 [建立]
  6. 查看《服務條款》,並按一下 [是] 表示您同意這些條款。

新容器初次載入時,系統會提示您安裝網站容器片段,或直接搭配您選定行動平台的 SDK 使用「代碼管理工具」;您可以立即安裝程式碼片段,也可以按一下 [確定] 來清除這個對話方塊。您可以每次都先設定容器,之後再安裝容器片段或 SDK。

在現有帳戶中新增容器

  1. 在「代碼管理工具」中,按一下 [帳戶] 然後 相關帳戶名稱旁的 更多
  2. 選擇 [建立容器]
  3. 重複上述步驟 4 到 6。

安裝容器

如果您對於編寫程式碼不熟悉,或是無權存取網站或行動應用程式程式碼,建議您尋求開發人員協助完成這個步驟。開發人員則可以參閱「代碼管理工具」開發人員快速入門指南瞭解詳情。
  1. 在「代碼管理工具」中按一下 [工作區]
  2. 在視窗頂端附近,找到格式為「GTM-XXXXXX」的容器 ID。
  3. 按一下容器 ID,「安裝代碼管理工具」方塊就會顯示。
  4. 按照「安裝代碼管理工具」方塊中的指示複製程式碼片段並貼到網站中,或下載並安裝正確的行動 SDK。請參閱下方的網頁AMP行動安裝提示。
一般網頁
  • <script> 程式碼片段放在網頁 HTML 輸出內容的 <head>,位置最好是盡量靠近 <head> 開頭代碼,但必須在所有 dataLayer 宣告下方。
  • <noscript> 程式碼片段放在 HTML 輸出內容中,位置緊靠 <body> 代碼後方。

為確保代碼不會啟動兩次,請將程式碼中所有已遷移至「代碼管理工具」容器的硬式編碼代碼移除。

為避免您的容器遭到第三方窺探,「代碼管理工具」的網頁程式碼片段預設使用 HTTPS。

如果您因故必須以支援非安全網頁的方式部署「代碼管理工具」容器,可將容器程式碼片段中的來源網址通訊協定調整為 //,以取代 https://進一步瞭解如何使用通訊協定相關網址

AMP 網頁
  • 將 JavaScript 程式碼片段的 <script> 部分放在 </head> 結尾代碼正上方。
  • <amp-analytics> 部分放在緊靠 <body> 開頭元素後方的位置。

詳情請參閱 AMP 和代碼管理工具設定指南

行動應用程式
導入行動應用程式專用「代碼管理工具」的做法要搭配 Firebase SDK,請參閱「代碼管理工具」開發人員文件,瞭解 AndroidiOS 適用的步驟。

使用「代碼管理工具」的預覽模式Tag Assistant Chrome 擴充功能,驗證已安裝的容器或排除相關問題。

加入、更新及發佈代碼

安裝容器後,您就可以新增代碼了。

  1. 在導覽選單中按一下 [代碼]。
    • 若要加入代碼:按一下 [新增],然後選取代碼類型,並指定代碼啟動時機的觸發條件。
    • 若要修改代碼:按一下清單中的代碼,然後在「編輯代碼」網頁上進行變更。舉例來說,您可以更新代碼啟用時機的觸發條件。
    • 如要刪除代碼:按一下清單中的代碼,然後在「編輯代碼」頁面上按一下畫面右上角的 更多 選單圖示,並選擇 [刪除]
  2. 預覽模式方便您查看網站或應用程式上的「代碼管理工具」設定,以確保一切運作如常。在網站上,您可以使用偵錯功能,以瞭解您瀏覽以及與網站互動的過程中哪些代碼啟動了。
    • 在工作區內任一個包含未發佈變更的網頁中,按一下 [預覽]瞭解詳情
    • 如果是行動應用程式,請詳閱 AndroidiOS 的開發人員說明文件。
  3. 準備就緒後,按一下畫面右上角的 [提交] 即可開始發佈變更。請添加版本名稱版本說明等詳細資料,然後按一下 [發佈]
大部分「代碼管理工具」導入作業的第一步都是部署 Google Analytics (分析) 網頁瀏覽代碼。詳細方法請參閱部署 Google Analytics (分析) 代碼的逐步操作說明。
這對您有幫助嗎?
我們應如何改進呢?