Google 標記管理器 - 快速指南

Google 標記管理器 – 概述

要了解 Google 標記管理器，我們首先需要了解一些相關的概念。

產品營銷 - 背景

隨著網際網路和網路的出現，為了在推廣產品方面脫穎而出，出現了巨大的需求。這個時代已經超越了廣告和營銷透過紙質媒體就能取得良好效果的時代。

隨著產品營銷需求成為一項專注且熟練的任務，出現了一種新的專業人士，稱為“產品營銷人員”。這些人需要了解市場趨勢、使用者行為以及受眾的喜好。

產品營銷人員需要扮演分析師和廣告主的角色，需要了解很多事情才能掌握全域性。其中一件事是——為成功使用者參與建立營銷活動。

如果我們參考維基百科對產品營銷的定義——**產品營銷是指向受眾推廣和銷售產品的過程**。

簡而言之，產品營銷人員需要建立各種促銷活動以保持競爭優勢，從而提高銷量。

自網際網路熱潮以來，為了成功進行產品營銷，產品不僅需要存在於現實世界，還需要存在於網路世界。網路世界中的存在和接受程度與產品的成功成正比。

產品營銷工具

在追求提高產品銷量並保持創意的過程中，產品營銷人員需要了解某些有效的工具。這些工具本身有助於營銷產品並相應地分析使用者趨勢。

以下是一些常用的產品營銷工具：

Google Analytics（谷歌分析）
Chartbeat
Kissmetrics
Sprint Metrics
Woopra
Clicky
使用者測試
Crazy Egg
Mouseflow
Mint

毫無疑問，谷歌憑藉其產品——谷歌分析位居榜首。在產品營銷發展初期，谷歌就推出了這款分析工具。事實上，它是產品營銷社群中最可靠和使用最廣泛的工具。

該工具以使用者友好的介面執行，並具有其獨特的工作方式。使用者需要將谷歌分析賬戶號碼新增到其各自的網站/部落格頁面。相應地，使用者訪問和點選次數將由谷歌分析跟蹤。

使用不同的分析工具

與谷歌分析類似，上面列表中提供的每個其他工具都具有不同的工作方式。在使用特定工具時，需要修改網站/部落格程式碼才能開始跟蹤使用者行為。

這些工具可以分析哪些頁面使用次數最多，使用者執行了哪些活動等。此外，這些工具還可以以資料的形式快速提供新發布功能的反饋。

谷歌分析的工作方式與大多數其他列出的工具的工作方式非常相似。現在，假設一家規模較大的產品組織專注於構建一項新功能以增強其客戶體驗。對於這種大型組織來說，擁有龐大的釋出流程/管道非常有用，以便以無縫的方式推出所需的功能。

引入谷歌分析。為了使谷歌分析發揮作用，產品網站程式碼中的所有頁面都需要包含此賬戶號碼。雖然聽起來很簡單，但對於大型產品組織來說，有時在頁面中新增一小段程式碼可能很麻煩，並且在建立此功能後需要進行嚴格的測試。

如果產品組織的目標是使用上面列表中給出的多個數據分析工具，那麼根據使用的工具數量，時間和成本方面的投入將成倍增加。隨著產品的成熟，這會變得很痛苦。最終，衡量使用者行為也變得至關重要。在這種情況下，擁有一個一勞永逸的機制非常重要，以便產品營銷人員能夠更輕鬆地即時建立不同的活動。

由於不同的工具使用不同的技術來跟蹤使用者行為，因此需要採用單一媒介來處理這些使用不同工具的不同技術。

Google 標記管理器 - 簡介

對於產品營銷人員來說，使用不同的工具需要各自的學習曲線。擁有不同的工具意味著需要輸入不同的程式碼，從而導致網站發生變化。如果有一個簡單直接的更改網站程式碼的過程，那麼新增與不同分析工具相關的不同程式碼就會變得輕鬆愉快。

Google 標記管理器 (GTM) 是一款免費工具，使營銷人員能夠輕鬆新增和更新網站標籤。這些標籤可以啟用網站頁面瀏覽量監控、轉化跟蹤等。使用 Google 標記管理器，您可以擁有有效的標籤管理解決方案，從而能夠快速輕鬆地更新網站標籤。標籤基本上是程式碼片段，用於流量分析和營銷最佳化。

對於參與不同產品分析解決方案的產品營銷人員來說，Google 標記管理器必不可少，因為它在一個平臺上涵蓋了產品營銷的許多方面。您可以使用 Google 標記管理器新增和更新 AdWords、Google Analytics、Firebase Analytics、Floodlight 和其他第三方標籤。

Google 標記管理器 - 設定

要設定 Google 標記管理器，必須擁有一個網站。在本教程中，我們將按照以下步驟設定 Google 標記管理器。

使用 Blogger.com 設定部落格
建立 Google 標記管理器賬戶
在部落格上安裝標籤

使用 Blogger.com 建立部落格

**步驟 1** - 要開始建立部落格，請訪問以下連結：https://blogger.com。Blogger 的主頁將彈出，如下面的螢幕截圖所示。

**步驟 2** - 點選“建立您的部落格”按鈕開始建立部落格。

下一步，Blogger 將要求您提供您的 Google 賬戶。作為 Google 產品之一，Blogger 透過允許使用 Google 賬戶線上建立部落格來簡化您的操作。

**步驟 3** - 輸入您的 Google 憑據，您將看到以下建立部落格的螢幕。

**步驟 4** - 選擇您喜歡的標題、地址和部落格主題。

輸入標題非常簡單，您可以根據需要提供任何標題。對於地址，當您開始鍵入所需的部落格地址時，介面將開始搜尋可用性。下面的螢幕截圖顯示瞭如何搜尋部落格地址。

完成此過程並確認部落格地址可用後，您將在文字框中看到以下訊息。

如上面的螢幕截圖所示，選擇了部落格地址 - https://gtmtutorial2017.blogspot.com。

**步驟 5** - 選擇所需的設計後，點選紅色按鈕“建立部落格！”。

系統將花費幾秒鐘，您的新部落格就會準備就緒。完成後，您將看到以下介面，可以開始撰寫部落格。

至少需要一篇帖子才能有效地檢視 Google 標記管理器的執行情況。

**步驟 6** - 透過點選藍色連結按鈕“建立新帖子”來建立您的第一篇部落格帖子。

**步驟 7** - 您可以開始撰寫您的第一篇部落格帖子的內容。根據需要在螢幕頂部提供帖子標題。

很多時候，Blogger 可以輕鬆地編寫 HTML 和富文字內容。這可以透過使用螢幕左上角的切換按鈕“撰寫/HTML”來實現。讓我們以使用“撰寫”選項為例。

**步驟 8** - 點選“撰寫”，將顯示一個富文字編輯器。開始新增一些內容。

**步驟 9** - 完成後，點選螢幕右上方的“釋出”按鈕。

您將被重定向回上面螢幕截圖所示的螢幕，列表中將顯示一個新的帖子。這結束了在 Blogger.com 上的網站建立。

下一步是建立一個 Google 標記管理器賬戶。然後，我們將容器程式碼新增到網站。最後，我們將能夠使用 GTM 跟蹤頁面瀏覽量/相應的事件。

建立 Google 標記管理器 (GTM) 賬戶

**步驟 1** - 要開始使用 Google 標記管理器，請使用以下連結：Google 標記管理器。您將看到 Google 標記管理器的以下主頁。

**步驟 2** - 點選“免費註冊”的任何連結。這些連結位於頁面中央和右上角。

**步驟 3** - 隨意瀏覽頁面，因為它提供了關於 Google 標記管理器的非常有用的資訊。

點選“免費註冊”後，您將看到以下螢幕，並且 URL 將更改為 - https://tagmanager.google.com/?hl=en。這將在使用您的 Google 賬戶登入的螢幕下方顯示。

輸入您的 Google 憑據後，將顯示標記管理器介面。

**步驟 4** - GTM 將要求您新增新的賬戶。有兩個步驟：

設定賬戶
設定容器

**步驟 5** - 首先，新增賬戶名稱。在本教程中，我們將使用名稱“Google 標記管理器教程”。您可以選擇與 Google 和其他人匿名共享資料，以增強您的產品營銷體驗。

**步驟 6** - 點選“繼續”。

**步驟 7** - 下一步是設定容器。為容器提供一個名稱。讓我們新增名稱“標籤容器”。在下面的螢幕截圖中顯示的“在何處使用容器”下，選擇“網路”。

**步驟 8** - 點選“建立”。

然後，您將看到一個螢幕，要求您接受 Google 標記管理器服務條款協議。

**步驟 9** - 點選“是”繼續。

步驟 10 − 最後，您將看到一組程式碼片段，如下面的螢幕截圖所示，這些程式碼片段需要新增到head 和body 標籤下。

這些程式碼片段是必需的，以便從建立的部落格中獲取的資料流入 Google 標記管理器介面。

我們將在後續章節中詳細介紹標籤建立和相關流程。

Google 標記管理器介面

讓我們花點時間熟悉 Google 標記管理器介面上的不同部分。

首先，讓我們瞭解如何管理以下部分：

工作區
版本
管理員

工作區

工作區部分顯示正在進行的活動工作。此部分具有不同的子部分，例如：

概述
標籤
觸發器
變數
資料夾

我們將在後續章節中詳細瞭解這些子部分。

版本

大型組織通常會建立一些標籤，並將其用於審查或審批流程。

同時，可能需要了解之前釋出在網站上的標籤。出於所有這些目的，我們可以使用“版本”部分。這顯示了當前工作區中釋出的每個可能的標籤，並在需要時允許回滾更改。

管理員

如果您希望為不同的環境或不同的使用者配置您的 Google 標記管理器帳戶，可以使用此部分。

您還可以配置帳戶詳細資訊並檢視與帳戶相關的活動，如果有多個使用者與該帳戶關聯。

Google 標記管理器 - 入門

本章概述瞭如何開始使用 Google 標記管理器、新增標籤並分析其完整性。

在整個過程中，我們將使用部落格（在上一章中建立）來演示不同的步驟。

步驟 1 − 如上圖所示，點選右上角容器程式碼 (GTM-XXXXXXX)，位於“工作區更改：0”標籤旁邊。

您將看到“安裝 Google 標記管理器”對話方塊。

現在，我們希望將 Google 標記管理器程式碼安裝到我們的部落格上。

步驟 2 − 要將上圖中的 GTM 程式碼新增到部落格上，請訪問https://Blogger.com並使用您的憑據登入。

您將看到如下所示的螢幕，其中包含列表中的部落格文章名稱。

步驟 3 − 從左側面板中，找到選項：“主題”。

您將看到以下螢幕。

步驟 4 − 點選“編輯 HTML”以編輯部落格的 HTML 程式碼。您的部落格的 HTML 原始碼將可見，如下面的圖所示。

在這裡，我們希望安裝 Google 標記管理器程式碼。按照 GTM 的指示，我們需要在以下位置插入程式碼：

在<head>標籤中儘可能高的位置
在<body>標籤中

步驟 5 − 在上面的 HTML 程式碼中找到<head>標籤。返回https://tagmanager.google.com，並複製步驟 1 中“安裝 Google 標記管理器”對話方塊中的程式碼。將複製的程式碼貼上到<head>標籤開啟標記的正下方。

步驟 6 − 同樣，在 HTML 程式碼中找到<body>標籤。

注意 − 您可以使用快捷鍵 Ctrl + F 查詢<head>和<body>標籤。瀏覽器的搜尋功能將有助於查詢標籤。

找到<body>標籤後，重複該過程以複製與<body>標籤關聯的 Google 標記管理器程式碼。

為了便於定位標籤，通常，<body>標籤將以<body expr:class = '"loading" + data:blog.mobileClass'>開頭。

將所需的程式碼貼上到<body>標籤下，然後點選“儲存主題”。

它將顯示以下錯誤，看到該錯誤是正常的。

步驟 7 − 為了解決此問題，在<head>標籤下的 Google 標記管理器程式碼中，找到包含以下內容的行：

j = d.createElement(s),dl = l != 'dataLayer'?' &l = '+l:'';j.async = true;j.src =

將上面一行中下劃線標註的&替換為&，然後點選“儲存主題”。錯誤將得到解決。

至此，將 Google 標記管理器程式碼新增到您的部落格的過程結束。

標籤簡介

正如 Google 標記管理器支援網站上簡單說明的那樣，標籤是一段將資訊傳送到第三方（例如 Google Analytics）的程式碼。

借鑑這一點，對於特定分析工具，可以有多個關聯的標籤。將它們都放在一個頁面上確實是一個優勢，因為產品營銷人員將能夠看到與該頁面關聯的多個指標。

但是，這裡還有一個同樣重要的要點需要注意，不要在網站上過度使用標籤。這不僅增加了管理標籤時的混淆，而且還使得區分來自各個標籤的資料變得麻煩。

以下程式碼，正如我們在“安裝 Google 標記管理器”對話方塊中看到的那樣，實際上是一個標籤。

<!-- 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://#/gtm.js?id='+i+dl;
      f.parentNode.insertBefore(j,f);
   })
   (window,document,'script','dataLayer','GTM-M8QLQCZ');
</script>
<!-- End Google Tag Manager -->

標籤的位置

標籤的位置可以在頁面原始碼中的任何位置。它可以位於頂部，就像上面的那個一樣，也可以位於頁尾，傳輸所需的資訊。

至此，標籤的快速介紹以及如何建立標籤的介紹結束。

觸發器

觸發器實際上檢測何時觸發標籤。它們是一組配置標籤觸發時間的規則。例如，觸發器可能會決定當使用者執行“Y”操作時，特定標籤“X”將被觸發。更具體地說，觸發器可以指示標籤在單擊特定表單中的特定按鈕時觸發。

觸發器是可以附加到標籤上的條件，以便以所需的方式工作。舉個現實世界的例子，假設正在為電子商務頁面上的成功交易配置一個標籤。

該標籤將指示交易是否成功完成。為此，將建立一個觸發器，該觸發器將說明，僅當向用戶顯示交易確認頁面時才觸發該標籤。

更突出地，假設您想跟蹤部落格/網站的所有頁面瀏覽量。因此，具體來說，您可以使用 Google Analytics 建立一個標籤，當用戶訪問部落格/網站上的任何頁面時，該標籤將被觸發。在這種情況下，觸發器將是通用的，說明在所有頁面上觸發此標籤。觸發器將相應設定。

觸發器有時會變得複雜。例如，如果有人在特定頁面上單擊一個按鈕，則觸發一個標籤。

如以下圖所示，您可以透過點選螢幕左側面板上的“觸發器”來訪問觸發器。

由於尚未配置任何觸發器，因此您在觸發器上將看不到任何結果。

變數

從本質上講，變數是可以更改的值。

例如，讓我們考慮一個簡單的連結點選。當點選連結時，會收集與此點選事件相關的幾個內建變數。這些變數最終可以用於記錄連結，當用戶點選特定連結按鈕時，該連結將被重定向。

詳細一點，您還可以使用變數記錄被點選元素的特定 div 類。它們被稱為變數，因為如果頁面上有 10 個不同的連結按鈕，則來自這些連結按鈕的重定向將發生變化，具體取決於點選了哪個元素。

您可以使用左側面板並點選“變數”來訪問變數。

Google 標記管理器提供兩種型別的變數：

內建變數
使用者定義變數

顧名思義，您可以使用 Google 標記管理器提供的現有變數，也可以建立自己的變數。

讓我們考慮一個示例，並瞭解標籤如何工作。我們現在將使用 Google 標記管理器除錯標籤。

除錯標籤

在本節的開頭，我們花時間將 Google 標記管理器跟蹤程式碼新增到 Blogger.com 上的部落格中。

這是讓 Google 標記管理器識別我們的跟蹤程式碼的第一步。如果您仔細觀察，在包含在<head>標籤中的指令碼中，存在一個格式為 GTM-XXXXXXX 的 Google 標記管理器跟蹤程式碼。

現在，當涉及到除錯標籤時，使用 Google 標記管理器介面非常簡單。我們將使用基本 Google Analytics 標籤進行演示。我們假設 Google Analytics 帳戶已存在。

建立基本 Google Analytics 標籤

在 Google 標記管理器中，要建立標籤，需要執行多個步驟。為了詳細瞭解每個步驟，讓我們考慮以下螢幕。

步驟 1 − 點選“新增新標籤”按鈕。

右側將滑出一個面板，以啟動建立新標籤的過程。這將顯示一個未命名的空白標籤，供您進行配置。

步驟 2 − 為您的標籤提供一個名稱。讓我們將其命名為 - 第一個標籤。

步驟 3 − 完成後，點選文字/圖示 - 選擇標籤型別以開始設定……。

另一個面板將從右側滑動，其中將顯示以下標籤型別。

正如我們在定義中看到的，有不同的標籤與不同的分析工具相關聯。在此特定步驟中，Google 標記管理器要求您指定要建立的標籤的確切型別。

您將注意到一些標籤型別，如下所示：

通用分析
經典 Google Analytics
AdWords 再營銷
Google Optimize

注意 − 通用分析是 Google Analytics 的增強版，也是最流行的版本。但是，許多網站使用經典 Google Analytics。

對於此示例，讓我們繼續指定通用分析。

步驟 4 − 點選“通用分析”以繼續。控制元件將切換回上一個螢幕，您將需要選擇要跟蹤的內容。請參閱以下螢幕截圖以供參考。

步驟 5 − 選中“啟用此標籤中的覆蓋設定”。

注意 − 我們使用此步驟是為了更快地熟悉標籤建立。您也可以在不選中上述複選框的情況下繼續建立 Google Analytics 設定變數。

步驟 6 − 開啟 Google Analytics 介面。在 Google Analytics 中，找到首頁上的“管理員”按鈕。在“屬性”部分下，點選“屬性設定”。您將能夠看到類似於以下內容的螢幕。

步驟 7 − 複製跟蹤 ID。跟蹤 ID 的格式為 UA-XXXXX-X。

步驟 8 − 複製跟蹤 ID 後，返回到 Google 標記管理器介面。如前所述，將跟蹤 ID 貼上到關聯的文字框中。

現在，我們即將配置標籤的重要元素 - 觸發器。

我們將指示 Google 標記管理器，如果使用者查看了頁面，則應觸發標記。為此，我們應該使用螢幕上的下一部分配置觸發器。

步驟 9 − 點選選擇一個觸發器以觸發此標記…

一個對話方塊將從左側滑出，要求您選擇一個觸發器。它將顯示如下螢幕截圖所示的觸發器。

步驟 10 − 點選所有頁面。

控制元件將返回到標記配置螢幕。點選右上角的藍色“儲存”按鈕。您已成功配置了您的第一個標記！

步驟 11 − 現在，對於除錯模式，點選灰色的“預覽”按鈕。

如上圖所示，將出現一個橙色框。這表示除錯模式已開啟。使用提供的連結訪問您的部落格。

步驟 12 − 現在，當您訪問部落格時，您應該能夠在您的部落格上看到一個顯示 Google 標記管理器除錯部分的區域。

此外，如果您仔細觀察，在“此頁面上觸發的標記”下顯示了第一個標記。這表示我們的標記在頁面成功檢視後被觸發了。

步驟 13 − 在除錯部分，點選變數。然後，點選左側面板上的視窗載入。此操作意味著我們正在選擇一個操作來分析因該操作而載入的變數。

它將顯示如下螢幕截圖中綠色框中標記的變數部分。

當我們進入下一章時，您可以更清楚地分析變數。

Google 標記管理器 - 跟蹤標記

一旦您瞭解了建立標記的過程，深入瞭解並瞭解如何使用不同的方法實現跟蹤就很有意義了。

頁面瀏覽量標記

產品營銷人員需要了解產品網站/部落格的訪客數量。這非常關鍵，因為它有助於瞭解訪客趨勢。它可以用來了解網站/部落格中新增的特定增強功能/功能是否受到訪客的歡迎，訪客是否每天/每週訪問網站等。

考慮到“頁面瀏覽量”在瞭解網站/部落格的受歡迎程度方面具有極大的重要性，讓我們看看如何使用標記跟蹤頁面瀏覽量。

步驟 1 − 正如我們在上一章中遵循的步驟一樣，讓我們訪問 Google 標記管理器中的標記部分。

它將顯示最近建立的標記 - 第一個標記。

步驟 2 − 點選第一個標記，它將顯示配置的觸發器等的對話方塊。

如上圖所示，讓我們將注意力集中到跟蹤 ID 上。

此跟蹤 ID 與Google Analytics相關聯。當我們啟動除錯模式並訪問部落格時，它將被計為單個頁面瀏覽量。

在此刻，Google Analytics將在其介面中記錄頁面瀏覽量。

步驟 3 − 使用 Google 標記管理器進行除錯，並開啟Google Analytics 儀表盤，在流量來源 → 概覽下，您將看到以下統計資訊。

這表明已記錄了頁面瀏覽量，並且相應的頁面瀏覽量將在 Google Analytics 中進一步跟蹤。

連結標記

很多時候，會有一些促銷優惠，使用者可能需要離開部落格或網站。除了促銷之外，這些還可能是使用者可能需要進行的一些第三方調查。這些調查將產生某些統計資料，這些資料將不同於透過不同標記傳入的資料。

為此，跟蹤連結被點選的次數以及使用者被引導離開網站很有用。此類連結稱為外部連結，可以使用 Google 標記管理器輕鬆跟蹤這些連結。

為了演示這一點，我們將在部落格中建立一個連結。

以上螢幕截圖顯示了一個名為 - 外部連結的連結。此連結將用於在 Google 標記管理器中進行跟蹤。它重定向到https://www.google.com

步驟 1 − 前往 Google 標記管理器工作區。點選左側面板中的標記。點選頁面上的“新建”按鈕以開始建立外部連結標記。

讓我們將標記命名為 - 外部連結標記。

步驟 2 − 遵循與初始標記設定相同的過程，將 Google Analytics 程式碼輸入到正確的欄位 - 跟蹤 ID 中。

步驟 3 − 選擇跟蹤型別欄位為事件。您將能夠進一步看到以下選項。

這些選項符合跟蹤型別 - 事件。請注意，在跟蹤型別 - 頁面瀏覽量下，這些選項根本不可用。這是因為，當我們將 Google Analytics 程式碼與 Google 標記管理器關聯時，要在即時檢視事件的詳細資訊，我們需要某些引數。

步驟 4 − 填寫以下表單詳細資訊。粗體文字是要在文字框中輸入的值。

類別 – 外部連結
操作 - 點選
保留標籤和值欄位為空
將非互動點選保留為False

步驟 5 − 接下來，在觸發部分，點選選擇一個觸發器以觸發此標記…

步驟 6 − 點選藍色+右上角的圖示。它將開啟自定義觸發器部分。為此觸發器提供一個名稱 - 點選觸發器。

步驟 7 − 點選選擇一個觸發器型別以開始設定…

它將顯示如下螢幕截圖所示的以下觸發器型別。

步驟 8 − 如上圖所示，點選點選觸發器型別下的僅連結。這將顯示配置新建立的觸發器型別的不同選項。

現在，我們需要配置觸發器，如果點選的 URL 的頁面路徑為https://www.google.com，則觸發該觸發器。請注意，我們已將部落格上的連結配置為重定向到同一 URL。

步驟 9 − 完全按照上圖所示配置觸發器。

我們希望配置此觸發器，以便在頁面 URL 等於https://www.google.com時，在某些連結點選時觸發。完成後，螢幕應如下所示。

步驟 10 − 點選儲存按鈕儲存此新建立的觸發器。螢幕將返回到外部連結標記的標記配置。

步驟 11 − 點選儲存以完成配置。

如上圖所示，外部連結的完整標記應如下所示。

現在，讓我們讓標記生效。

步驟 12 − 在工作區中，點選預覽按鈕。除錯模式將啟動。

步驟 13 − 在您的瀏覽器中，在另一個選項卡中，開啟您的部落格。除錯視窗將顯示在螢幕底部。

如上所示，由於我們尚未點選連結，因此標記仍顯示在“此頁面上未觸發的標記”下。

步驟 14 − 點選上一步中建立的外部連結，標記將被觸發。您可以在“此頁面上觸發的標記”下看到它。

這總結了為外部連結建立標記以跟蹤部落格/網站上的連結的方法。

事件跟蹤

事件跟蹤代表任何不同於頁面載入的操作。瀏覽器對您在頁面上執行的任何操作都有特定的響應。例如，操作可以像點選連結或提交表單一樣簡單，也可以像跟蹤檔案檢視和下載一樣複雜。

使用 Google 標記管理器，您可以輕鬆跟蹤瀏覽器中生成的事件。它記錄瀏覽器對潛在操作的響應，從而輕鬆獲得特定事件的跟蹤。

我們將使用上述示例來檢視事件跟蹤的實際效果。在上一個示例中，我們建立了一個連結，該連結會重定向到我們的部落格之外。在本示例中，我們將建立另一個連結，該連結將指向我們的部落格。我們使用此示例是為了演示如何無縫地跟蹤離開部落格的連結。

我在部落格中建立了一個名為內部連結的連結。此連結將重定向到同一部落格頁面。

讓我們轉到 Google 標記管理器儀表板併為外部連結建立一個新的觸發器。我們將為此使用內建變數點選 URL。使用點選 URL，我們將檢測點選的連結是否正在將使用者重定向到部落格外部。

要啟用內建變數點選 URL，請執行以下步驟。

步驟 1 − 在變數部分，點選紅色按鈕，配置。它將顯示可用的內建變數。有不同的內建變數可用，分別是 - 頁面、實用程式、錯誤、點選等。

步驟 2 − 在點選類別中，選中點選 URL 複選框。這將立即顯示點選 URL 中可用的變數。請參閱以下螢幕以供參考。

現在變數已配置，我們可以配置觸發器了。

當用戶點選所有重定向到部落格外部的 URL 時，將啟用觸發器。建立此觸發器非常簡單。

步驟 3 − 轉到觸發器，點選新建。為觸發器提供一個名稱。假設名稱為 - 外部連結觸發器。

步驟 4 − 在觸發器配置下，點選選擇一個觸發器型別以開始設定…

步驟 5 − 從可用選項中，在點選下，選擇僅連結。請參閱以下螢幕以瞭解到目前為止的步驟。

點選僅連結後，您將被重定向到第一個部分，您需要在其中提供 URL 異常。以下是如何執行此操作的步驟。

步驟 6 − 對於選項，此觸發器觸發於，選擇某些連結點選。

步驟 7 − 在條件下，選擇點選 URL，該 URL 應先前已選擇。從條件選項中選擇值不包含。

步驟 8 − 在值的文字框中，輸入您的部落格 URL 的值。在我們的例子中，我們將輸入 gtmtutorial2017.blogspot.in。完成後，螢幕將類似於以下內容。

步驟 9 − 點選藍色的“儲存”按鈕儲存新觸發器。

現在該配置我們的標籤了，我們將使用它來跟蹤點選事件，該事件會將使用者重定向到部落格外部。

步驟 10 − 開啟“標籤”部分，點選“新建”按鈕。為您的標籤提供一個名稱，我們將其命名為 - 外部連結標籤。

步驟 11 − 在“標籤配置”下，點選“選擇標籤型別以開始設定…”，選擇標籤型別為通用分析，並在螢幕上輸入以下詳細資訊。

在“跟蹤型別”下，選擇“事件”。
對於“類別” - 輸入“外部連結”。
在“操作”中 - 輸入“點選”。
對於標籤，點選選項圖示。

步驟 12 − 在顯示的側邊欄上，選擇“點選 URL”。

步驟 13 − 完成後，勾選“啟用此標籤中的覆蓋設定”複選框。在“跟蹤 ID”文字框中，輸入您的 Google Analytics 跟蹤程式碼。

步驟 14 − 向下滾動以配置觸發器。我們將使用我們新建立的觸發器。

步驟 15 − 點選“選擇一個觸發器以使此標籤觸發…”，它將顯示可用的觸發器。選擇“外部連結觸發器”，這是我們之前建立的。

標籤配置到此結束。點選“儲存”按鈕。

步驟 16 − 現在，要除錯標籤，請點選灰色的“預覽”按鈕。它將以除錯模式啟動 Google Tag Manager。

步驟 17 − 返回您的部落格並重新整理部落格以啟動 Google Tag Manager 偵錯程式。考慮以上示例，頁面上顯示了兩個連結。此外，還有“外部連結標籤”，它顯示在“此頁面上未觸發的標籤”下。

現在該測試標籤配置了。我們將在兩種情況下使用 Ctrl + 點選來檢查標籤是否觸發。Ctrl + 點選將在新標籤頁中開啟連結，而不會重新整理當前頁面。我們需要保持頁面完整，因為如果頁面重新整理，我們將無法看到觸發的標籤。

步驟 18 − 首先，使用 Ctrl + 點選上圖中突出顯示的“內部連結”。理想情況下，標籤不應該觸發，因為該連結將使用者重定向到同一個部落格。

如上圖所示，在偵錯程式的“摘要”部分，您將看到另一個事件 - gtm.linkClick。這意味著 GTM 已記錄了點選事件。

但是，您不會在“此頁面上觸發的標籤”部分看到任何變化。這是因為我們已將標籤配置為出站連結。

步驟 19 − 現在 Ctrl + 點選一個出站連結（這在上一節中建立）。

觀察摘要部分，它將再次更新另一個事件 - gtm.linkClick。

如上圖所示，對於記錄的下一個事件，將有一個標籤觸發 - 外部連結標籤。您將在“此頁面上觸發的標籤”下看到它。

透過這種方式，您可以使用 Google Tag Manager 實現事件跟蹤，併為網站/部落格中所需的關鍵資料配置標籤。

表單跟蹤

通常，在任何網站/部落格上，您都會看到一個表單，用於捕獲使用者的某些詳細資訊。作為產品營銷人員，瞭解訪客是否正在使用表單會很繁瑣。

瞭解使用者填寫此表單的次數以及遇到錯誤的次數是一個不錯的方法。使用 Google Tag Manager，您可以輕鬆跟蹤表單提交。本節將引導您完成此過程。

在此示例中，我們將在部落格上建立一個“聯絡我們”表單。

步驟 1 − 對於博主，要建立聯絡表單，請使用“佈局”選項→“新增小工具”。點選“新增小工具”後，您將看到以下螢幕，其中包含“部落格搜尋”小工具。點選藍色的加號 (+) 圖示將其插入部落格。

完成後，它將顯示在您的部落格上，如下面的螢幕截圖所示。

現在，讓我們配置相關的觸發器和標籤。

首先從觸發器開始，我們將遵循相同的步驟。我們首先新增啟用名為“表單 ID”的內建變數，然後我們將建立一個利用此新建立的變數的觸發器。

完成後，我們將使用此新觸發器配置一個標籤來跟蹤與表單的互動。

要啟用內建變數“表單 ID”，請執行以下步驟。

步驟 2 − 在“變數”部分，點選紅色的“配置”按鈕。在“表單”類別中，選中“表單 ID”複選框。這將立即在可用變數中顯示“表單 ID”。請參閱以下螢幕以供參考。

現在變數已配置，我們可以配置觸發器了。

當用戶在“聯絡我們”表單中提交任何資料時，將啟用觸發器。

步驟 3 − 為此，請轉到“觸發器”，點選“新建”。為觸發器提供一個名稱。我們將其命名為 - 表單提交觸發器。

步驟 4 − 在觸發器配置下，點選選擇一個觸發器型別以開始設定…

步驟 5 − 在可用選項中，在“使用者參與度”下，選擇“表單提交”。請參閱以下螢幕瞭解到目前為止的步驟。

點選“表單提交”後，您將被定向回第一部分，您需要在其中提供“表單 ID”。

步驟 6 − 對於“此觸發器觸發於”選項，選擇“所有表單”。

完成上述步驟後，它將啟用對部落格頁面上提交的所有表單的跟蹤。您還可以使用特定的“表單 ID”，這可以在建立部落格時進行配置。

要配置特定的“表單 ID”，您可以尋求網站/部落格開發人員的支援以獲取更多詳細資訊。完成這些步驟後，請參閱以下螢幕以供完整參考。

步驟 7 − 點選藍色的“儲存”按鈕儲存新觸發器。

現在該配置我們的標籤了，我們將使用它來跟蹤將使用者重定向到部落格外部的點選事件。

步驟 8 − 開啟“標籤”部分，點選“新建”按鈕。為您的標籤提供一個名稱，我們將其命名為 - 表單提交標籤。

步驟 9 − 在“標籤配置”下，點選“選擇標籤型別以開始設定…”，選擇標籤型別為通用分析，並填寫以下詳細資訊 -

在“跟蹤型別”下，選擇“事件”。
對於“類別” - 輸入“表單提交”。
在“操作”中 - 輸入“表單已提交”。
對於標籤，點選選項圖示。

步驟 10 − 在顯示的側邊欄上，選擇“表單 ID”。

步驟 11 − 完成後，勾選“啟用此標籤中的覆蓋設定”複選框。在“跟蹤 ID”文字框中，輸入您的 Google Analytics 跟蹤程式碼。

向下滾動以配置觸發器。我們將使用我們新建立的觸發器。

步驟 12 − 點選“選擇一個觸發器以使此標籤觸發…”，它將顯示可用的觸發器。選擇“表單提交觸發器”，這是我們之前建立的。

標籤配置到此結束。點選“儲存”按鈕。

步驟 13 − 現在，要除錯標籤，請點選灰色的“預覽”按鈕。它將以除錯模式啟動 Google Tag Manager。

步驟 14 − 返回您的部落格並重新整理部落格以啟動 Google Tag Manager 偵錯程式。將有“表單提交標籤”，它顯示在“此頁面上未觸發的標籤”下。

步驟 15 − 現在與“搜尋此部落格”表單進行互動，在其中輸入一些值。讓我們輸入“First”，因為我們的第一篇博文包含單詞“First”。

步驟 16 − 點選“搜尋”。新事件將在“摘要”下顯示，並且“表單提交標籤”將在“此頁面上觸發的標籤”下顯示。

透過這種方式，我們可以使用 Google Tag Manager 建立“表單提交標籤”。

Google Tag Manager - 組織介面

除了建立標籤和管理關聯的觸發器和變數之外，Google Tag Manager 還提供了一些其他功能。這包括一些日常工作，例如組織使用者、資料夾（用於根據所需的順序組織標籤）等。

在本節中，我們將概述如何管理與標籤相關的使用者和不同資料夾。

使用者管理

產品營銷團隊使用單個 Google Tag Manager 帳戶來管理不同的營銷活動並非罕見。將存在不同的角色，這些角色將擁有某些許可權，例如建立標籤、刪除/修改標籤、建立其他使用者等。

使用者管理為利用 GTM 功能管理使用者提供了一個完整的門戶。使用者管理在兩個級別上工作 -

帳戶級別
容器級別

要訪問使用者管理，請點選左上角選單欄中的“管理員”。

如以下圖所示，您將能夠看到與帳戶和容器關聯的使用者管理。

兩者之間的重要區別在於 - 如果您在帳戶級別向用戶提供訪問許可權，則該使用者可以訪問該帳戶下的所有容器。而如果在容器級別向用戶提供訪問許可權，則該使用者只能修改/新增/刪除該容器下的標籤。

要檢視所有可用訪問級別的詳細資訊，請點選容器級別下的“使用者管理”（以上黃色突出顯示）。

這將顯示具有其提供的許可權的可用帳戶。通常，這將是您用於登入 GTM 的 Google 帳戶。

點選紅色的“新建”按鈕。它將顯示以下螢幕。

如該圖所示，您可以新增您選擇的電子郵件地址，您希望授予其訪問許可權，然後在容器級別提供所需的許可權。

以下是可用的許可權 -

無訪問許可權 - 阻止使用者訪問容器標籤。
讀取 - 使用者只能讀取標籤。無法執行修改或刪除操作。
編輯 - 使用者可以新增/修改/刪除可用標籤。
批准 - 使用者具有更高的許可權，可以批准標籤到即時環境中。有關環境的更多資訊，請參閱本教程的後續部分。
釋出 - 所有許可權，類似於管理員使用者。

容器級別使用者管理概述到此結束。

在帳戶級別，可以將使用者配置為普通使用者或管理員使用者。

可以向被新增的使用者分配類似的許可權；唯一的區別是 - 該使用者可以訪問此帳戶下的所有容器。

帳戶級別使用者管理概述到此結束。

資料夾

當您的帳戶中有大量標籤和觸發器時，尤其需要資料夾。當您有如此大量的標籤/觸發器需要處理時，資料夾可以證明很有用。

要將標籤和觸發器組織到這些資料夾中，可以使用自己的創意。可以根據不同的應用領域或使用者或建立目的來建立資料夾。產品營銷團隊可以自行決定採用特定的資料夾結構。

從正在使用的分析工具的角度來看，另一種看待資料夾的方法是。基於分析工具，可以建立一個標籤，這將對長期發展有所幫助。

要建立不同的資料夾，請點選左側面板中的“資料夾”。您將看到以下螢幕。

到目前為止建立的標籤將顯示在螢幕上。您可以透過使用螢幕右上角的“新建資料夾”選項建立不同的資料夾來組織標籤。

點選“新建資料夾”後，將開啟一個快速彈出視窗，如下所示。

從前面的螢幕，您可以隨時根據需要將標籤移動到所需的資料夾中。

Google Tag Manager 中建立資料夾的介紹到此結束。

Google Tag Manager - 釋出標籤

我們一直在除錯環境中建立、修改和除錯標籤。到目前為止，我們還沒有看到部落格上的即時標籤。

要使標籤在部落格上即時顯示，我們需要釋出標籤。我們希望釋出標籤，而不是始終處於預覽模式。

釋出標籤非常簡單。

步驟 1 − 點選螢幕右上角的“提交”按鈕。

它將顯示以下螢幕。

步驟 2 − 輸入一個可識別的版本名稱，以便可以輕鬆理解所做的更改。

在版本描述中，您可以儘可能詳細地說明該版本中標籤的更改/新增內容。

步驟 3 − 向下滾動到工作區更改，您將看到標籤中所做的所有更改，這些更改未釋出或處於預覽模式。

同樣，在活動歷史記錄中，您可以準確瞭解自一開始以來帳戶中所做的更改/更新。

步驟 4 − 提供版本名稱和描述。您可能希望將版本名稱設定為第一個版本，並將描述設定為第一個 Google 標記管理器更新。

目前，我們將“釋出到環境”保留為“即時”。這是因為我們還沒有除“即時”之外的其他環境。

步驟 5 − 點選“釋出”，您將看到此特定版本的摘要。

這就是您如何在 Google 標記管理器中釋出工作區中所做的更改的方式。

您可以使用 Google Chrome 外掛 – Google 標記助手在不使用預覽模式的情況下檢視標籤的觸發情況。

在 Google 標記管理器中建立環境

我們可以透過多種方式配置要與 Google 標記管理器一起使用的環境。

通常，在軟體世界中，“環境”一詞用於表示特定功能正在測試/審查的位置。

步驟 1 − 要檢視 Google 標記管理器中可用的環境，請點選“管理員”。

步驟 2 − 在“容器”部分下，點選“環境”。

您將能夠看到上面顯示的螢幕。

通常，大型軟體公司將其網站劃分為不同的環境，以簡化釋出功能的過程。開發人員在其開發網站上工作，然後將功能更改推送到登臺站點。最後，當在登臺站點驗證更改後，將更改推送到即時環境。

在 Google 標記管理器的上下文中，可以靈活地新增不同的環境，這將允許您在標籤上線之前完全驗證您的標籤。在本教程中，我們將建立一個名為“開發”的環境。以下是步驟。

步驟 3 − 點選紅色的“新建”按鈕。您將能夠看到以下對話方塊。

步驟 4 − 填寫上圖所示的詳細資訊。我們將假裝我們的開發站點與我們現在正在使用的站點相同，以便相應地推送更改。

步驟 5 − 點選“建立”，您將看到如下提示。

如上圖所示，該提示顯示了兩種使用環境的方式。

使用共享預覽連結 − 當您希望在團隊成員之間傳播標籤中的更改時，此連結非常方便，尤其是在團隊規模較大的情況下。
使用程式碼片段 − 如果您清楚某個特定站點將用作您的開發/登臺環境，則可以使用此程式碼片段選項。此環境的程式碼片段可用，以便您可以訪問該網站以檢視最近所做的任何更改。

步驟 6 − 點選“釋出到開發”以檢視這些操作。下一個螢幕將要求提供要推送到新建立環境中的可用更改。

尚未傳送到相應環境的更改將顯示。此外，還會顯示版本名稱，以便使用者清楚哪個版本釋出到相應環境。

步驟 7 − 點選“立即釋出”以檢視新建立的環境中可用的更改。它將顯示包含日期和時間戳的成功訊息。

從可用的環境列表中，點選新環境的名稱，在本例中為“開發”。

將顯示共享環境連結的可用選項，如下所示。

使用上述任何一種方法，您都可以在您的開發環境中檢視標籤中的更改。

Google 標記管理器 - 資料層

資料層可以看作是一個物件，它包含所有要傳遞和處理 Google 標記管理器的資訊。這是一個有點技術性的概念。術語“資料層”用於表示 Google 標記管理器用於在您的網站/部落格和標記管理器之間儲存、處理和傳遞資料的的資料結構。

為了進一步闡述，資料層可以向您的分析工具提供有關訪客的資訊。從另一個角度來看，資料層實際上是每個數字上下文子集的業務需求和目標列表。

讓我們以電子商務網站為例，業務需求可能包括：

交易資訊，包含有關購買了什麼商品的詳細資訊
訪客資料，關於誰購買了商品
有關購買的其他詳細資訊，例如在哪裡以及何時進行了購買
最後，有關其他因素的資訊，例如訪客是否訂閱了電子郵件更新

因此，簡而言之，資料層承載了可以根據需要由不同的工具/使用者/利益相關者使用資訊。

在 Google 標記管理器中，dataLayer 是一個 JavaScript 陣列。它由鍵值對組成。以下是一個包含不同資料型別的 dataLayer 的快速示例：

dataLayer = [{
   'products': [{
      'name': 'Western Cotton',
      'tuning': 'High-G',
      'price': 49.75
   },
   {
      'name': 'Fenda Speakers',
      'tuning': 'Drop-C',
      'price': 199
   }],
   'stores': ['Hyderabad', 'Bangloer],
   'date': Sat Sep 13 2017 17:05:32 GMT+0530 (IST),
   'employee': {'name': 'Raghav}
}];

在這裡，我們有不同的值，例如物件陣列（產品）、數值（價格）、字串陣列（商店）、日期物件和物件（名稱）。

另一方面，當您將 Google 標記管理器容器程式碼放置在您的網站上時，資料層會自動建立。

資料層本身是一個相當複雜的概念，第一次理解起來可能比較困難。本章將提供更多關於如何與資料層互動的見解。

資料層事件

資料層事件的一個快速示例可以是新聞稿登錄檔單，它不容易使用自動 GTM 監聽器進行跟蹤。網站開發人員可以支援您在新的訂閱者在您的網站上輸入其電子郵件後推送資料層事件。此事件的程式碼應如下所示：

push({‘event’: ‘new_subscriber’});

如果需要，您可以向您的開發人員詢問更多資訊，例如表單位置。如果您的網站上有多個表單，則需要此資訊。可以使用以下程式碼實現：

window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
   'formLocation': ‘footer’,
   'event': new_subscriber
});

此外，Google 標記管理器預設情況下會將某些值推送到 Web 應用程式的資料層。這些值是：

gtm.js − Google 標記管理器準備好執行時推送到資料層
gtm.dom − DOM 準備好時推送到資料層
gtm.load − 視窗完全載入時推送到資料層

檢查資料層

正如我們現在所知，某些事件是由於螢幕上的任何互動而建立的。

例如，讓我們考慮這個簡單的頁面載入事件。要檢視事件，您需要執行偵錯程式。在偵錯程式執行（處於預覽模式）後，訪問部落格。如果您檢視左下角的摘要視窗，您將看到以下內容：

步驟 1 − 點選“視窗載入”，然後點選“資料層”。

資料層選項卡中顯示的資訊是關於“視窗載入”事件的。

它顯示為 – {event: ‘gtm.load’, gtm.uniqueEventId: 3}

此外，如果您想仔細檢視，則需要藉助 Chrome 的控制檯選項卡。當您知道如何正確使用 Chrome 偵錯程式時，檢查資料層就會變得容易。

步驟 2 − 當您在部落格上時，右鍵單擊頁面上的任意位置。在顯示的上下文選單中，點選“檢查”。該面板將顯示在螢幕右側，並激活“元素”選項卡。

步驟 3 − 點選“控制檯”。在控制檯模式下，點選左上角的圖示以清除顯示的所有訊息。請參閱以下螢幕截圖以供參考。

步驟 4 − 清除視窗中所有先前訊息後，輸入 dataLayer，確保 L 的大寫正確。此名稱由 Google 標記管理器提供給其資料層。但是，您的開發人員可能會根據需要為其分配不同的名稱。

步驟 5 − 在 dataLayer 後按 Enter 鍵。它將顯示以下詳細資訊。

有三個物件，每個物件包含一些資訊。現在，這些物件可能與上圖所示的不同。dataLayer 是可配置的，開發人員可以根據需要配置它。

存在的值是由於該特定位置/空間中正在使用的 Blogger 小工具。這就是為什麼那裡存在某些資訊的原因。

如果您檢視物件 1，您會注意到觸發的事件是 – gtm.dom。它由 GTM 在載入頁面時觸發。

透過這種方式，您可以檢查資料層並在需要時向其中新增資訊。

資料層中的變數

現在我們已經熟悉了資料層，讓我們嘗試使用 Google 標記管理器介面讀取其中一個變數。

在這裡，我們將嘗試使用資料層變數讀取事件。

如果我們檢視上圖，變數 event 包含 gtm.dom。我們將從 GTM 介面建立一個變數，並檢視它如何在 Google 標記管理器下的“變數”選項卡中反映。

步驟 1 − 在 Google 標記管理器介面中，轉到“變數”。向下滾動到使用者定義的變數。點選“新建”。

步驟 2 − 為此新變數提供一個名稱，我們將其稱為 varEvent。

步驟 3 − 點選“選擇變數型別以開始設定…”

步驟 4 − 從列表中選擇“資料層變數”。

步驟 5 − 選擇“資料層變數”後，您需要提供名稱和版本。

這個名稱將來自 Google 標記管理器實際的資料層。如前所述，我們將跟蹤的變數是 – 事件。

步驟 6 − 在資料層變數名稱中輸入 event。

步驟 7 − 點選儲存。

步驟 8 − 點選預覽，檢視偵錯程式中反映的更改。

步驟 9 − 頁面載入完成後，點選“視窗已載入”，然後點選“變數”。滾動到“變數”部分的最底部，您將看到 varEvent，如上圖所示。

如上圖所示，該值將為 gtm.load。

透過這種方式，可以檢查資料層並在需要時捕獲資料層中的值。

Google 標記管理器 - 高階跟蹤

現在該看看一些複雜的場景了，在這些場景中，您可以跟蹤業務的關鍵元素。我們將瞭解如何建立一個自定義事件，該事件不是預定義的或預設可用的。

在本章中，我們將瞭解 −

實現自定義事件
滑鼠滾動跟蹤

實現自定義事件

在某些情況下，您可能希望建立一個與 GTM 中可用事件不同的事件。為了實現這一點，我們需要建立一個自定義事件，該事件利用資料層中現有的變數。

考慮一下我們點選之前建立的內部連結時的場景。讓我們建立一個名為 urlClick 的自定義事件，它將讀取資料層變數 gtm.elementurl。

步驟 1 − 為此，讓我們從“變數”部分建立一個名為 urlName 的變數。使用常規流程建立變數。

以上顯示的是資料層變數 – urlName 的示例。

現在，我們將使用此變數來建立我們的自定義事件。當我們建立觸發器時將使用自定義事件。請參閱以下螢幕截圖以供參考。

步驟 2 − 建立一個觸發器，以便在點選內部連結時觸發已經存在的事件。在“事件名稱”下，指定 gtm.linkClick。

現在，讓我們建立標籤。

步驟 3 − 按照建立標籤的相同流程操作。以下是詳細資訊 −

標籤型別 – 通用分析
跟蹤型別 – 事件
類別 – 連結點選
操作 – 點選

步驟 4 − 對於標籤，使用最近建立的標籤 urlName。

步驟 5 − 完成後，選中“在此標籤中啟用覆蓋設定”。在“跟蹤 ID”文字框中，輸入您的 Google Analytics 跟蹤程式碼。

選擇觸發器時，請確保選擇最近建立的觸發器 – URL 已點選。

步驟 6 − 儲存標籤。點選預覽以檢視部落格中的更改。

步驟 7 − Ctrl + 點選內部連結。您應該能夠在“摘要”框中看到 gtm.linkClick 事件。此外，您應該會看到標籤已觸發，如以下螢幕截圖所示。

透過這種方式，我們可以使用現有事件來建立我們自己的自定義事件，併成功跟蹤我們想要的控制元件。

滑鼠滾動跟蹤

在吸引部落格使用者方面，產品營銷人員可能希望檢測滑鼠滾動。滑鼠滾動的檢測至關重要，因為它將需要進一步的操作，例如顯示時事通訊連結或觸發彈出視窗以提供某種產品折扣。

使用 Google 標記管理器，我們可以輕鬆跟蹤滾動事件。為此，我們需要使用第三方程式碼，我們將在建立標籤時使用該程式碼。

該程式碼可在此處找到。我們將在建立標籤時使用它。

步驟 1 − 建立一個觸發器。我們將此觸發器稱為 – 滾動觸發器。

請參閱以下影像以瞭解觸發器配置。

步驟 2 − 配置觸發器型別 – DOM 就緒。允許此觸發器在 – 所有 DOM 就緒事件上觸發。

步驟 3 − 完成上述步驟後，點選儲存。

現在讓我們建立標籤。

步驟 4 − 這次，在建立標籤時，選擇不同的跟蹤型別，如以下螢幕截圖所示。

步驟 5 − 選擇自定義 HTML 後，將顯示一個用於輸入 HTML 程式碼的空間。

步驟 6 − 輸入從此處複製的程式碼。

步驟 7 − 向下滾動以配置觸發器。需要選擇我們最近建立的觸發器（上面的“滾動觸發器”）。

步驟 8 − 點選儲存。

步驟 9 − 現在，啟動 GTM 偵錯程式並重新整理部落格頁面。您將在“摘要”和“標籤”部分看到兩個主要更改。

步驟 10 − 現在，向下滾動以檢視部落格的其餘部分，將觸發幾個其他事件。

滾動距離
滾動計時

這些事件最終將用於檢測滑鼠滾動的位置並相應地採取進一步的操作。

列印頁面