您可以配合內建變數可能尚無法處理的特定需求,在 Google 代碼管理工具中建立網頁適用的使用者定義自訂變數。
建立新的使用者定義變數的做法如下:
- 在左側導覽窗格中按一下 [變數]。
- 在「使用者定義的變數」部分,按一下 [新增]。
- 按一下「變數設定」,然後選取所需的變數類型。
- 為選定的變數類型輸入設定選項。
- 為變數命名 (請使用能夠描述變數用途的名字,例如「資料層變數 - 產品名稱」)。
- 按一下「儲存」。
代碼管理工具可支援下列幾種網頁適用的使用者定義變數類型:
導覽
HTTP 參照網址
這個值會是 HTTP 參照網址,也就是使用者瀏覽的前一個網頁的網址;比方說使用者從首頁前往您其中一個產品網頁,那麼參照網址就是首頁。代碼管理工具會自動建立一個這類型的變數,但如果您需要顯現參照網址的其他部分,可以建立更多這種變數。
網址
這類變數可用來剖析及顯現構成網址的元件。您可以建立更多這種變數來顯現網址的其他部分。可選擇的網址元件如下:「完整網址」、「通訊協定」、「主機名稱」、「通訊埠」、「路徑」、「副檔名」、「查詢」及「片段」。這類變數的輸入值組合為使用者目前所瀏覽網頁的網址 (擷取自 document.location),但您可以藉由調整「網址來源」,讓代碼管理工具使用其他變數做為網址值的來源。
網頁變數
第一方 Cookie
這個值會是第一方 Cookie 的值以及使用者目前所在網域的名稱。如果同一個網域上部署了多個同名的 Cookie,系統會選擇第一個值;若您在網頁內呼叫了 document.cookie 並選用第一個結果,也會取得相同的值。
自訂 JavaScript
這個值會是 JavaScript 函式的結果。JavaScript 的形式必須是一個會傳回值的匿名函式。舉例來說,您可以建立自訂的 JavaScript 變數,藉此將所有預先定義的 {{url}} 變數轉換成小寫:
function () {
return {{url}}.toLowerCase();
}
資料層
系統可經由 dataLayer.push() 呼叫將資料推送至資料層來設定這個值:
dataLayer.push({"Data Layer Name": "value"}).
您可以指定代碼管理工具解讀鍵名中半形句點 (「.」) 的方式:
- 版本 1:允許鍵名包含半形句點。舉例來說,如果是
dataLayer.push("a.b.c": "value"),您可以將鍵名解讀為「a.b.c」(意即{"a.b.c": "value"})。 - 版本 2:將半形句點視為巢狀值。例如將
dataLayer.push({"a.b.c": "value"})解讀為三個巢狀層級:{a: {b: {c: "value"}}}。
JavaScript 變數
這個值會是您指定的 JavaScript 全域變數。如果所需的值並未在資料層中設定 (請參閱「資料層變數」部分的說明),也沒有在 DOM 中顯示 (請參閱「DOM 元素變數」部分的說明),您或許可以從 JavaScript 變數中擷取這個值。若您能夠在網頁原始碼中找到所需值 (須為 JavaScript 全域變數),請使用這個變數類型。
網頁元素
自動事件變數
系統會擷取觸發了事件的項目資訊 (例如點擊、表單提交、元素可見度等等)。
- Element (元素):這會傳回元素物件,且可視為自訂 JavaScript 物件 (例如
{{Element}}.title),或 CSS 選取器中的物件 (例如 {{Element}} matches CSS Selectordiv.foo)。{{Element}}.title - Element Type (元素類型):這會傳回
element.tagName值 (例如「A」、「BUTTON」、「IMG」)。 - Element Attribute (元素屬性):指定屬性名稱後,這個選項就會傳回該屬性的值。
- Element Classes (元素類別):這會傳回元素
class屬性內的類別清單。 - Element ID (元素 ID):這會傳回
ID屬性的值。 - Element Target (元素目標):這會傳回
target屬性的值 (例如「_blank」)。 - Element Text (元素文字):這會傳回元素文字內容的值。
- Element URL (元素網址):這會傳回從
href或action屬性收集的元素網址。 - History New URL Fragment (記錄新網址片段):這會傳回瀏覽器記錄中的新網址片段 (例如「#summary」)。
- History Old URL Fragment (記錄舊網址片段):這會傳回瀏覽器記錄中的舊網址片段 (例如「#intro」)。
- History New State (記錄新狀態):這會傳回新記錄狀態物件 (由網站的
pushState呼叫控制)。 - History Old State (記錄舊狀態):這會傳回舊記錄狀態物件 (由網站的
pushState呼叫控制)。 - History Change Source (記錄變更來源):這會傳回造成記錄變更的事件 (例如「pushState」、「replaceState」等等)。
DOM 元素
這個值會是 DOM (文件物件模型) 元素的文字或指定 DOM 元素屬性的值。如果所需的值並未在資料層中設定 (請參閱「資料層變數」部分的說明),您或許可以從 DOM 中擷取這個值。如果能夠在 DOM 中找到所需的值,請使用這個變數類型。
如果設定選用屬性的名稱,系統會傳回該屬性中指定的值 (例如 data-food="cupcake") 做為變數值,否則變數值會是 DOM 元素中的文字。
元素可見度
這個值是根據指定 DOM 元素的可見狀態而設定。與元素可見度觸發條件不同的是,單一元素可見度變數只能記錄一項元素的可見度。選擇是否要根據元素 ID 或 CSS 選取工具來選取元素。如果有多個元素符合指定的 CSS 選取工具,系統會採用第一個相符的元素。
您可以為這個變數選擇輸出類型:
- True/False:此為布林值,用來表示參照這個變數時,選定元素是否可見。
- 百分比:此為 0 到 100 間的百分比值,用來表示參照這個變數時,選定元素在畫面上的可見範圍有多大。
如果您選用 True/False 做為輸出類型,還可以搭配指定「最低可見百分比」,藉此設定選定元素在畫面上的可見範圍必須有多大,才傳回 True 做為變數值。
公用程式
Analytics 儲存空間
Analytics 儲存空間變數類型是自訂變數選項,也是存取重要 Google Analytics ID 的可靠方式。
建立 Analytics 儲存空間自訂變數時,可以選取下列資料欄位:
- 用戶端 ID:匿名使用者或裝置的專屬 ID。
- 工作階段 ID:使用者工作階段的專屬 ID。
- 工作階段編號:使用者目前工作階段的編號。
變數也包含「更多設定」部分,可根據所選資料欄位提供選用設定:
| 資料欄位 | 評估 ID | Cookie 前置字元 | 說明 |
| 用戶端 ID | 不適用 | 選用 | 如有需要,可依特定 Cookie 前置字串篩選。 |
| 工作階段 ID | 選用 | 選用 | 如果提供評估 ID,Google 代碼管理工具會傳回與該評估 ID 對應的單一工作階段 ID。如果未提供評估 ID,系統會傳回複合字串,內含所有相關 Google Analytics 工作階段 Cookie 的 ID。 |
| 工作階段編號 | 選用 | 選用 | 如果提供評估 ID,Google 代碼管理工具會傳回與該評估 ID 對應的單一工作階段編號。如果未提供評估 ID,系統會傳回複合字串,內含所有相關 Google Analytics 工作階段 Cookie 中的數字。 |
Analytics 儲存空間變數會簡化讀取及剖析各種 Google Analytics Cookie 的複雜度,確保取得的 ID 穩定可靠,且適用於 Measurement Protocol 等情境。
常數
這個值會是您提供的字串。如果有多個代碼使用同一個帳號,通常會採用常值字串變數。另請參閱「Google Analytics 設定」部分瞭解詳情。
自訂事件
這個值會是推送至資料層的自訂事件名稱。
環境名稱
這種變數會傳回在預覽模式時查看的環境名稱。
Google 代碼:配置設定
您可以使用這個變數來設定 Google 代碼載入時的設定層級參數。
舉例來說,假設您以多種語言發布網站,且想要根據閱讀的語言區隔目標對象,則可使用language 參數建立設定變數,然後在 Google 代碼中運用這個變數,而不必手動更新每個代碼。
Google 代碼:事件設定
您可以使用這個變數來設定事件層級參數,透過 GA4 事件傳送額外資料。
舉例來說,假設您有一家網路商店正在舉辦特賣會,並想追蹤有多少人使用您提供的折扣碼,則可透過「Google 代碼:事件設定」變數重複使用參數,而不必將 discount 參數加進每個代碼。
對照表
系統會根據對照表中的指示設定這個值。對照表包含兩個資料欄,下面以空白對照表說明資料之後的使用方式:
| 當 [選取變數] 等於 | 將 [這個變數] 設為 |
|---|---|
您使用對照表建立變數後,其值會根據另一個變數的值變動。如果您的網站設定能夠將適當的值 (例如轉換 ID) 對應至網址、DOM 元素或網頁的其他部分,就適合使用這個方式來建立變數。在下列範例中,我們建立了一個名為「Conversion ID」(轉換 ID) 的變數;如果網址包含「/thanks/buy1.html」,值會是「12345」;如果網址包含「thanks/buy2.html」,值會是「34567」。
| 當 {{url}} 包含 | 將 {{Conversion ID}} 設為 |
|---|---|
| /thanks/buy1.html | 12345 |
| /thanks/buy2.html | 34567 |
| /thanks/buy3.html | 56789 |
隨機數字
這個值會是介於 0 到 2147483647 的任一隨機數字。
規則運算式表格
規則運算式表格變數與對照表變數相似,但前者多了一項功能,可針對要比對的項目執行規則運算式模式。
規則運算式的設定像下面這樣時:
| 圖案 | 輸出 |
|---|---|
.*/page[1-3]\.html.* |
foo |
.*/page[4-6]\.html.* |
bar |
.*/page[7-9]\.html.* |
baz |
變數的輸出值如下:
| 相符結果 | 值 |
|---|---|
| http://example.com/page1.html | foo |
| http://www.example.com/page1.html | foo |
| http://example.com/page2.html#detail | foo |
| http://example.com/page5.html | bar |
| http://example.com/page5.html?status=new | bar |
| http://example.com/page6.html | bar |
| https://example.com/page9.html | baz |
規則運算式表格查詢會由清單頂端向下執行至清單底部,一旦找到相符的比對結果,便會傳回相應的輸出值。
選取 [設定預設值],設定沒有相符比對結果時的輸出值。
根據預設,模式必須與輸入字串完全相符,但不必區分大小寫。如有必要,您可以在「進階設定」中調整模式的行為:
-
忽略大小寫:您不需要在規則運算式中明確界定大小寫的處理方式,模式與大小寫文字都能比對成功。
-
必須完全相符:一旦啟用這個選項,模式就必須與輸入字串完全相符,效果與模式前後隱含開始錨點 (
^) 和結束錨點 ($) 相同。如果停用此選項,在輸入字串的任何部分發現模式時都算比對成功。 -
擷取群組和取代功能:啟用這個選項後,您就能使用錢幣符號取代語法,在輸出值中納入輸入字串的部分文字 (例如相符模式中的擷取群組)。舉例來說,如果相符的規則運算式為
/(news)/page(2)\.html,您可以分別使用$1和$2來參照第一個擷取群組 (「news」) 和第二個擷取群組 (「2」)。
使用者提供的資料
收集聯絡表單資訊,例如電子郵件、電話、姓名和地址。請使用下列其中一種模式指定要擷取的資訊:
- 自動設定:自動偵測網站上的表單欄位和新項目。
- 手動設定:可讓您將現有代碼管理工具變數對應至使用者提供資料的相應欄位,例如電子郵件、電話號碼、姓名和地址。
- 程式碼:可讓您指定資料層變數或自訂 JavaScript 變數,以傳回使用者提供的結構化資料物件。
容器資料
容器 ID
這會傳回代碼管理工具容器的 ID (例如「GTM-101010」)GTM-101010。
容器版本號碼
當容器處於預覽模式時,容器版本變數會傳回容器的預覽版本號碼;不是預覽模式時,這個變數會傳回容器的發佈版本號碼。
偵錯模式
容器處於預覽與偵錯模式時,值會設為「True」,否則會設為「False」。