如何用 GTM 設定「靜態網址搜尋」追蹤事件?

Ian
9 min readApr 14, 2024

觀察使用者搜尋的關鍵字對於網站內容的優化至關重要。無論是透過 Google Search Console 觀察使用者是如何找到你的網站,或是透過「 站內搜尋 」了解他們期待在網站上看到什麼內容,都能夠更深入地了解使用者的需求。

透過關鍵字的分析,我們能夠更有針對性地製作相應的內容,提供使用者更好的閱讀體驗,同時也提高網站在搜尋引擎中的曝光度。

我們可以透過 Google Search Console 觀察使用者在「 站外搜尋」時使用的關鍵字,而對於於站內搜尋的關鍵字,則可以透過 GA4 的加強型評估事件中的「 站內搜尋 」事件來追蹤,只需開啟此功能,就可以了解到使用者在網站內部的搜尋字詞。

但為什麼有些人的網站,即使打開了 GA4 的「站內搜尋」,依然紀錄不到搜尋字詞呢?

讓我們繼續看下去。

GA4 的「站內搜尋」事件是如何運作的?

在介紹「靜態網址搜尋」事件追蹤之前,我們先來了解一下 GA4 加強型評估中的「站內搜尋」是如何抓取使用者搜尋的關鍵字。

一般來說,網站搜尋結果頁面的網址通常具有以下形式,也就是所謂的「 動態網址 」。

在此「動態網址」列中,位於「」與「」之間的部分就是所謂的「搜尋字詞查詢參數」,在 GA4「站內搜尋」下方進階設定中,你會發現有一個與網址中這個位置相對應的欄位,用來設定你要追蹤的參數名稱。

因此,只要你的搜尋結果網址結構跟上圖相同,類似 www.xxx.com/?搜尋字詞查詢參數=xxx ,那就可以使用 GA4 內建的「站內搜尋」事件來進行搜尋字詞的追蹤,只是你的可能會是 ?q=xxx?search=xxx 或是 ?query=xxx ,如果都沒有跟預設的參數名稱相符,你也可以自行新增,只要結構相符就可以。

但是,如果搜尋結果網址沒有帶上任何參數,而是類似於 www.xxx.com/search/[搜尋關鍵字] 的靜態網址結構,該怎麼辦呢?

不用擔心,我們可以使用 GTM 來設定專屬的追蹤事件,以解決這個問題。

設定靜態網址追蹤事件

許多早期建置的網站為了符合 SEO 技巧並提升使用者體驗,常將網址設置成靜態結構,將關鍵字放在網址中,讓爬蟲以及使用者易於閱讀。因此,許多網站也將搜尋結果頁面設定為靜態網址結構。(不過這種網址友善命名這個技巧的影響已經逐漸減弱,這點 Google SEO 官方代表 John Meller 早在 2018 年就提出了這點。)

但許多網站到現在依然是繼續沿用當初的做法,也因此無法符合 GA4 「 站內搜尋」事件的觸發規範。接下來,我們將運用 GTM 中的「自訂 JavaScript 」變數結合「GA4 事件」代碼,來完成靜態網址類型的搜尋事件設定,同時沿用原 GA4 加強型評估的「站內搜尋」事件及參數名稱。

首先,假設搜尋結果頁的「靜態網址」結構如下圖:

(網址中的「搜尋關鍵字」就是使用者真正搜尋的字詞,這邊只是示範,所以才用這樣的名稱)

建立「自訂 JavaScript 」變數

GTM 左側面板選擇「變數」 > 下拉至「使用者定義的變數」區塊選擇「新增」 > 點擊中間「請選擇變數類型以開始設定」 > 選擇右側的「自訂 JavaScript

接著我們將下列這段代碼,貼到「自訂 JavaScript」的欄位中,看不懂這段 JavaScript 代碼沒關係,這段代碼在處理的就是在抓取網址 /search/ 之後文字,也就是使用者搜尋字詞的部分。

因此,如果你的網址中沒有 /search/ 而是別的名稱,請自行替換成你網址中相對應的名稱。

(例如:你的網址是 www.xxx.com/keyword/[搜尋關鍵字],就請將 /search/ 替換成 /keyword/)

function extractSearchKeyword() { 
var pagePath = window.location.pathname;
var searchParam = '/search/'; //引號內可以替換成你自家網站網址列中真正的網址

if (pagePath.includes(searchParam)) {
var keyword = pagePath.split(searchParam)[1].split('/')[0];
return decodeURI(keyword);
}
}

完成之後畫面如下圖所示,命名之後儲存,我們就可以開始測試這段代碼是否成功抓取網址列中的搜尋字詞。

檢查是否有抓取到搜尋關鍵字

打開 GTM 「 預覽模式」,並在網站中執行一次搜尋動作,假設我們搜尋的是「搜尋關鍵字」,此時網址列中的網址應該是 http://marketingholic.com/search/搜尋關鍵字

回到 Tag Assistant 介面,找到 上一段設定的「 自訂 JavaScript」變數,可以看到「 」為我們在網站上搜尋的字「搜尋關鍵字」。

確認有正確抓取相對應的「值」之後,就可以開始設定「 GA4 事件 」代碼,將搜尋事件發送到 GA4。

設定搜尋事件代碼

GTM 左側面版選擇「 代碼」 > 右上角「 新增」 >「 Google Analytics(分析)」>「 Google Analytics(分析):GA4 事件

接下來關於事件以及參數名稱的設定,我們會沿用 GA4 加強型評估事件預設的名稱,分別是 view_search_results 以及 search_term,這部分的資料,都可以在 官方文件 中找到。

  1. 事件名稱」欄位中輸入 view_search_results
  2. 事件參數」欄位中數入 search_term,「值」欄位中輸入上一段設定好的「自訂 JavaScript」變數(也可以透過旁邊的「+」選擇到該變數,或是直接輸入「 {{ 」就會出現變數的下拉選單。)

設定觸發條件

因為網址有改變,所以我們可以用「網頁瀏覽」觸發條件類型來作為代碼的觸發條件。

(對於「網頁瀏覽」觸發條件上不熟悉的朋友,可以參考這篇文章: 認識 GTM 網頁觸發條件,如果想對其它觸發條件應用有更進一步的認識,可以參考這篇: 我們該在「何時」使用「何種」觸發條件?)

GTM 左側面板選擇「 觸發條件」 > 右上角「 新增」> 選擇觸發條件類型「 網頁瀏覽

選擇「部分的網頁瀏覽」 ,條件設定為當「自訂 JavaScript」變數的「 」不是 undifined 或是 null 的時候,便可以滿足觸發條件,設定完成的畫面會如下圖:

完成之後,接著將觸發條件與代碼綁定(如下圖),接著就可以到「預覽模式」進行測試。

測試一下

我們預期的情況應該是:

當使用者在網站上進行搜尋且送出時,會來到網址為 www.xxx.com/search/搜尋字詞 的搜尋結果頁,此時「GA4 事件」代碼便會啟動,且抓到的參數「值」為該搜尋字詞,並傳送到 GA4 當中。

確認代碼有在正確的時機啟動同時抓取到了我們要的參數值之後,還要來到 GA4 的 DebugView 確認是否有接收到事件,這是所有 GTM 代碼設定完畢之後不可或缺的檢查流程。

GA4 DebugView 畫面

GTM 中的 GA4 事件代碼正確發送且 GA4 也有收到資料之後,我們就可以將代碼提交,同時也記得要去關閉 GA4 加強型評估事件中的「 站內搜尋」。

(雖然靜態網址不會觸發 GA4 預設的「站內搜尋」事件,但既然都用不到,我們還是將其關閉,避免預料之外的意外發生)

如何在 GA4 報表中的找到搜尋字詞?

GA4 左側選擇「 探索」 > 「 任意形式」報表 > 維度欄位選擇「 搜尋字詞」 > 指標欄位選擇「 事件計數

(參數名稱 search_term 對應的維度名稱為「搜尋字詞」)

總結一下

透過上述的設定,配合 GA4 的「探索」報表,我們可以瞭解使用者在網站上搜尋了哪些字詞。這有助於我們發現更多內容主題的靈感。

另外,我們也可以回到網站上,將報表上的「搜尋字詞」輸入搜尋欄,看看我們是否提供了相關的內容,以滿足使用者的需求。

--

--