Google 代碼管理工具的元件

代碼、觸發條件、變數和資料層的搭配運作方式。

Google 代碼管理工具運用下列概念來處理代碼的設定及啟動方式:

  • 代碼:代碼是一段程式碼,可以將資料傳送到 Google 等系統。
  • 觸發條件:觸發條件可以監聽特定事件,例如點擊、提交表單或載入網頁。
  • 變數:變數是指為某個值預留的具名位置,例如產品名稱、價格值或日期。
  • 資料層:代碼管理工具導入資料層是為了暫時保留用戶端的值,以供代碼、觸發條件和變數使用。

本文旨在協助您瞭解這些概念如何搭配運作。

代碼和觸發條件

「代碼」是指在網頁或行動應用程式上執行的一段程式碼,具有各種用途。不過在代碼管理工具中,大多是用來將追蹤資訊從您的網站傳送到第三方,Google Analytics (分析) 代碼Google Ads 轉換追蹤代碼就屬於這類功能的代碼。

如果不使用代碼管理解決方案,您就必須將每個代碼的程式碼手動添加到原始碼中。有了 Google 代碼管理工具的幫助,從網頁使用者介面就可以控制所有代碼。

代碼因事件而「啟動」,事件可以是載入網頁、點擊按鈕、捲動頁面等狀況,不一而足。在 Google 代碼管理工具中,您可以定義「觸發條件」來監聽事件,並指定代碼的啟動時機。

觸發條件和變數

除了使用 Google 代碼管理工具提供的多種內建變數外,您還可以設定其他自訂變數。舉例來說,預先定義的變數「url」會包含目前載入網頁的網址。如果您希望代碼只在 example.com/purchase/receipt.html 這個網頁上啟用,請依照以下設定來定義觸發條件:

  • 事件:瀏覽量
  • 觸發條件類型:瀏覽量
  • 啟動時機:部分瀏覽量
    • 下列條件全都符合時啟動代碼:
      網址包含 example.com/purchase/receipt.html

設定內建變數或自訂變數,在您需要時,應用程式就能取得適用資訊。您可以在觸發條件中使用這些變數或將資訊傳送至代碼。

變數和資料層

資料層用來暫時保留資料。Google 代碼管理工具能解讀資料層採用的結構化格式,方便您將這些來自您網頁或行動應用程式的資料傳送到代碼管理工具中的代碼、觸發條件及其他變數。

不過,就算您未設定資料層,變數也能擷取資訊。您可以設定 Google 代碼管理工具變數,直接從 JavaScript 變數、第一方 Cookie 或 DOM 擷取值。不過,最好的做法還是讓變數直接從結構良好的資料層物件擷取資訊。導入資料層有助避免程式碼不小心遭到修改,不僅能保持資料模型結構完整以供存取,而且還能簡化疑難排解的過程。

注意:您必須在網路應用程式的每個網頁中添加程式碼,才能將所需資訊加入資料層;資料層設定不會自動逐頁套用。

導入範例

考量以下幾點能協助您判斷是否需要導入資料層:

  • 如果您的代碼只需要在網頁載入時啟動 (例如不需要因應使用者在網頁上的互動而啟動),且不需要網址和參照網址以外的任何資訊,那麼您只需要將容器程式碼片段加進網站的每個網頁中即可。資料層對您來說可能就不那麼必要。
  • 如果您的代碼只須在網頁載入時啟用,但會用到網址和參照網址以外的資訊 (如網頁類型或 User ID),您就需要加入程式碼來建立資料層,並將資訊推送至資料層。
  • 如果您需要的資料必須在使用者與網頁互動後才能取得,您必須加入程式碼,並將資料推送至資料層,且您必須設定 Google 代碼管理工具,以在指定事件發生時運用資料層。

相關資源

這篇文章實用嗎?
我們應如何改進呢?