分析現有的代碼設定

安裝新代碼前，請先評估網站或行動應用程式中現有的代碼 (如果有的話)，以免加入多餘的代碼。本文說明如何評估現有代碼。

即使完成初步評估，您仍應將定期檢查納入標準代碼管理程序。定期評估網站或應用程式上執行的代碼，對於資料保護和安全性至關重要。

如要評估現有代碼，請使用下列資源：

• Google Tag Assistant
• Google 代碼管理工具的功能
• 手動程式碼檢查技術

Tag Assistant

Google Tag Assistant 是代碼分析工具，可用於 Google 代碼安裝。啟用後，Tag Assistant 會在瀏覽器中顯示偵錯窗格，方便您查看已觸發的 gtag.js 指令及其觸發順序。Tag Assistant 會顯示哪些資料將傳送至資料層，以及觸發這些資料交換作業的事件。此外，也會顯示命中 (HTTP 要求) 和相關參數。進一步瞭解 Tag Assistant。

代碼管理工具

您可以檢查代碼管理工具帳戶和容器，分析現有的代碼設定。代碼管理工具也提供預覽模式，功能與 Tag Assistant 類似。

搜尋

您可以使用代碼管理工具容器中的搜尋列，找出代碼、觸發條件和變數中的代碼、設定或程式碼行。搜尋列是找出可能包含設定或程式碼的代碼，以便重新評估的好方法。

版本

代碼管理工具的「版本」功能會顯示現有容器設定的摘要。

1. 在代碼管理工具中，按一下「版本」。
2. 按一下清單中的最新版本，即可查看容器的目前狀態。

代碼管理工具會在這個檢視畫面中列出代碼、觸發條件、變數和自訂範本。

預覽模式

代碼管理工具的預覽模式會顯示網頁上觸發的代碼、觸發這些代碼的事件，以及推送至資料層的資料。預覽模式的運作方式與 Tag Assistant 大致相同。進一步瞭解預覽模式。

手動檢查程式碼

如要更全面地分析現有代碼設定，建議您手動檢查程式碼。在原始碼中搜尋下列常見的代碼關鍵字，找出潛在的代碼設定：

• gtag(：這是 gtag() 指令的開頭，這些程式碼片段通常包含額外的檢測。
• googletagmanager.com：這個網域會載入代碼管理工具和 gtag.js 功能，可協助您找出這類代碼。

如果您已使用 gtag.js 或 Google 代碼管理工具，可以更新現有代碼或檢測，不必導入新設定。

• dataLayer：可用來確認是否已建立資料層程式碼，以及 dataLayer.push() 呼叫是否包含特定事件的檢測。
• analytics.js 或 ga.js：用於舊版 Google Analytics 導入作業的程式庫檔案名稱。
• conversion.js 或 conversion_async.js：用於 Google Ads 轉換評估的程式庫檔案名稱。
• optimize.js：用於 Google 最佳化工具代碼。
• 可能包含 Google 代碼的第三方代碼管理系統。在原始碼中尋找可能的第三方代碼管理系統，例如 utag.js 或 _satellite。

Google 代碼

如果您已在網頁中加入 Google 代碼片段，可以查看代碼，進一步瞭解其用途。目前的 Google 代碼片段如下所示：

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

舊版程式碼片段如下所示：

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

    gtag('config', 'GA-XXXXXX-1');
  </script>

在使用舊版導入時，您可能會看到多個 gtag('config',...) 行，用於其他產品和帳戶。例如：

  <!-- Google tag (gtag.js) - Prior version snippet -->
  <script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID"></script>
  <script>
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());
    
    gtag('config', 'GA-XXXXXX-1');
    gtag('config', 'GA-YYYYYY-2');
    gtag('config', 'TAG_ID');
  </script>

注意：gtag('config') 指令已淘汰。在更新後的 Google 代碼安裝中，額外的目的地和參數是在 Google 代碼管理工具使用者介面中設定，而不是新增多個網頁內 gtag('config') 行。現有的 gtag('config') 呼叫仍可正常運作，以確保回溯相容性。瞭解詳情。

舊版中的每個 config 行都包含產品前置字元 (表示正在設定哪個產品)，後面接著要設定的帳戶 ID。進一步瞭解產品前置字元。

注意：指令碼來源網址中顯示 ID 的產品和帳戶 (即程式碼片段頂端 www.googletagmanager.com/gtm.js?id 或 /gtag/js?id 後方的 ID)，就是「控制」Google 代碼的產品和帳戶。在某些情況下，瞭解這一點很重要，因為 Google Analytics 資源的已連結網站代碼等部分功能，只能從該產品和帳戶控制的代碼中啟用。

Google 代碼的產品前置字元

代碼或容器 ID 可用來識別 Google 代碼片段載入的 Google 代碼管理工具容器或 Google 目的地設定。新安裝的代碼預設會使用 Google 代碼管理工具容器 ID (GTM-)，而目的地專屬 ID 則用於識別個別 Google 產品。 下表概略列出支援的 ID 前置字元：

前置字串	ID 類型	說明
GTM-XXXXXX	Google 代碼管理工具容器 ID (預設)	Google 代碼管理工具容器的預設 ID。支援所有 Google、第三方和自訂代碼。
G-XXXXXX	目的地專屬 ID	識別 Google Analytics 目的地 (評估 ID)。
AW-XXXXXX	目的地專屬 ID	識別 Google Ads 廣告到達網頁 (轉換 ID)。
DC-XXXXXX	目的地專屬 ID	用於識別 Floodlight 目的地 (廣告主 ID)。
MC-XXXXXX	目的地專屬 ID	用於識別 Google Merchant Center 目的地。
GT-XXXXXX	Google 代碼 ID	用於識別在舊版中建立的 Google 代碼。

設定 Google 代碼的網頁可能會使用 GTM- 容器 ID 或特定目的地 ID，例如 G- (Google Analytics)、AW- (Google Ads)、DC- (Floodlight) 或 MC- (Merchant Center)。如果網頁已載入含有其中一個 ID 的 Google 代碼，您可以在 Google 代碼管理工具中連結其他目的地，不必在網頁中加入其他代碼片段。進一步瞭解如何設定代碼 ID

注意：網站上的容器 ID 前置字元 (例如 GTM- 與 G- 或 AW-) 會決定指令碼執行權限和功能。詳情請參閱「容器類型和 ID 前置字元」。

Google 代碼管理工具

使用代碼管理工具設定的網頁會安裝容器代碼，類似於以下範例。您可以檢查容器程式碼，找出代碼管理工具容器 ID。容器 ID 的開頭為「GTM-」。請參閱下方容器 ID 放置位置範例：

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

舊版程式碼片段如下所示：

<!-- 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 -->

取得容器 ID 後，請開啟 Google 代碼管理工具帳戶畫面，然後按一下 搜尋這個 ID。接著，您可以檢查網站的 [代碼、觸發條件和變數設定]代碼設定。