使用 Google Tag Manager 進行表單事件跟踪
已發表: 2021-07-19如果您正在尋找一種簡單的方法來設置事件跟踪以監控您網站上的轉化情況，您可能需要考慮使用 Google 標籤管理器。
在這篇文章中，我將解釋 Google Tag Manager，讓您知道如何安裝它，並描述如何在您的網站上設置表單事件跟踪。
什麼是 Google 標籤管理器？
Google Tag Manager (GTM) 是一款免費工具，可讓網站管理員和營銷人員更輕鬆地添加和更新網站標籤。 使用 GTM 的方法有很多種，但大多數企業將其用於事件跟踪，以此作為衡量其數字營銷策略成功與否的一種手段。 有關 GTM 的更深入解釋，請查看我們的介紹性博客文章。
為什麼使用 GTM 進行事件跟踪？
GTM 可讓您完全控制您的事件代碼。 您可以將它們添加到您的網站，而無需要求您的開發人員進行任何硬編碼。 這將騰出時間來處理其他關鍵項目。
GTM 還允許您自己修改和測試您的事件跟踪，這顯然使過程更加簡單。
此外，我們看到越來越多的網站使用 JavaScript 創建表單。 這些網站不使用目標網址，這意味著您不能在 Analytics 中使用簡單的目標。 為了使您的網站管理面向未來，最好考慮掌握 GTM。
安裝 GTM
安裝 GTM 與設置 Google Analytics 非常相似：
- 使用您的 Google 帳戶登錄 Google Tag Manager - 最好與您用於 Analytics 的帳戶相同。 然後按照屏幕上的步驟操作：
在 Google 跟踪代碼管理器上創建一個帳戶 - 閱讀並接受條款和條件。 然後您將獲得安裝代碼。 您需要將此代碼添加到您網站的每個頁面，緊跟在 <body> 開頭標記之後。 如果您自己無法做到這一點，您的開發人員應該能夠提供幫助：
將 GTM 代碼粘貼到您網站的每個頁面上
就是這樣。 您已在網站上設置了跟踪代碼管理器容器。 此容器最終將保存您在 GTM 儀表板中創建的所有標籤。
我現在將描述如何使用 GTM 設置事件跟踪。 為此，您需要在頁面、點擊和表單中啟用多個內置變量。 當您設置 GTM 時，這些默認情況下不會啟用。 因此，在我們開始之前，導航到變量並檢查以下選項：
表單事件跟踪
表單提交跟踪允許您監控訪問者何時在您的網站上提交表單。 這可以是您的聯繫我們頁面上的聯繫表，也可以是頁面頁腳中的查詢表。 幾乎每個網站都有一個表單，所以這是掌握標籤管理器的好方法。
使用 GTM 設置事件跟踪相對容易，因為您可以使用 GTM 界面中已內置的標籤。 HTML 代碼的基本知識很有用，但本指南將解釋您需要了解的一切。
不用擔心，使用標籤管理器破壞您的網站是不可能的，而且您可以在實時推送您的標籤之前測試所有內容。
我們開工吧！
第 1 步 - 識別 URL
記下您的表單所在的 URL：
如果您在多個頁面上有一個表單，例如頁腳中的查詢表單，您只需要知道域。 在本例中，我們使用了halam.co.uk 。
第 2 步 - 識別表單 ID
找到提交按鈕的表單 ID。 如果您使用的是 Google Chrome 或 Firefox，您可以通過右鍵單擊表單並選擇“檢查元素”來執行此操作。 您需要在 <form> 中查找“id”屬性。 下面是一個示例：
提示：在檢查器中按 ctrl + f 可以搜索內容。
注意：如果您的表單沒有唯一 ID，您可能需要讓您的開發人員添加一個。 但是，如果您的網站使用的是表單插件，例如 WordPress 的聯繫表單 7，您可以自己添加一個 id。
第 3 步 - 創建觸發器
在 GTM 中，創建一個新觸發器並為其指定一個標題，以便以後輕鬆識別。 像“查詢表單提交”或“聯繫頁面表單提交”之類的東西就可以了。
在選擇事件下，選擇表單提交：
單擊繼續，然後選中“等待標籤”和“檢查驗證”以確保您的觸發器在成功（有效）表單提交時觸發：
單擊繼續並輸入您之前記下的 URL 路徑：
如果您的表單位於多個頁面上，您可以將觸發器設置為在包含您的域的頁面上觸發：
單擊繼續，然後選擇“某些表格”：
要完成您的觸發器，請添加您之前記下的表單 ID（不要使用我的表單 ID！）：
您現在已經指定了觸發觸發器所需的條件。 接下來，我們將創建一個標籤。
第 4 步 - 創建標籤
創建新的 Universal Analytics 代碼。 此標籤會將事件信息發送到 Google Analytics。 再次，確保給它一個令人難忘的名字：
在下一個字段中添加您的 Google Analytics 跟踪 ID：
然後將跟踪類型填寫為事件，並確定類別和標籤的跟踪參數：
如果您要為在多個頁面上找到的表單進行設置，就像我在本例中一樣，請單擊標籤右側的框並從下拉菜單中選擇 {{Page Path}}。 這將確保您可以在 Analytics 事件報告中看到表單提交事件是從哪個頁面觸發的：
在“非交互命中”下，您可以選擇 true 或 false。 非交互命中是一個參數，可讓您決定被觸發的事件是否影響跳出率等指標。 例如，如果您有一個自動播放視頻的頁面，您可能需要選擇“true”。 否則，登陸該頁面的每個人都會觸發一個事件，並且跳出率將為零。
對於表單提交跟踪，我建議選擇“false” - 特別是如果您正在跟踪的表單位於登錄頁面上，訪問者可以在其中看到他們需要的所有信息並填寫您的查詢表單。 畢竟，即使他們沒有查看您網站上的另一個頁面，他們已經進行了交互並完成了所需的操作，因此應該是交互命中：
接下來，單擊繼續並在“開火”下選擇“更多”。 選擇“表單”，然後導航到您之前創建的觸發器：
單擊“創建標籤”，您完成的標籤將如下所示：
第 5 步 - 測試
前往預覽和調試模式以測試您的新事件跟踪是否有效：
在同一瀏覽器中，打開一個新選項卡並導航到您的網站，標籤管理器將為您打開調試模式。 從這裡您可以預覽您的容器，它會告訴您哪些標籤已經或尚未在您的頁面上觸發：
在上面的例子中，這些標籤都沒有在我的頁面上觸發，包括我提交的查詢表單。 現在我可以直接在頁面上測試表單，看看正確的標籤是否移動到“在此頁面上觸發的標籤”：
第 6 步 - 發布
測試您的標籤是否有效後，返回 GTM 儀表板並發布您的版本。 請記住，如果下一個版本不太好，您可以重命名版本並恢復到版本：
Ta-da — 您的新事件跟踪標籤和触發器現已上線。
表格優化
您可能希望改進網站上的表單以增加轉化次數。 您可以使用 GTM 跟踪每個表單字段以找出需要測試和改進的內容。 或者，您可以使用 Hotjar 等服務為您提供有用的漏斗分析以優化轉化率。
結論
如果您想在設置事件跟踪時提高效率並消除測試難題，我強烈建議您使用 Google 標籤管理器。
我發現當開發人員忙於在網站上處理更大的正在進行的項目時，他們會欣賞這個決定，因為它可以騰出時間。 在入門級，您可以使用標籤管理器中的內置標籤，版本控制和調試模式功能使您能夠自己測試所有內容。
如果您使用 Google 標籤管理器使用本指南實施表單事件跟踪，我們很樂意在下面的評論中聽到它。 或者，通過 Twitter @Digital_Kym 與我聯繫。
如果您需要幫助，請隨時與我們聯繫。