GA4 會自動收集點擊事件，但僅包含「點擊外連連結」的點擊。
可前往「管理 > 資源 > 資料串流」，點擊安裝在網站的資料串流，點擊「加強型評估」，確認「點擊」事件是否被勾選 ( 預設勾選 )，如果已經勾選，表示 GA4 會自動收集的事件。
自訂事件追蹤 : 想對網頁上某個元素做點擊追蹤，仍需先埋好全局的GA代碼，再個別針對想要追蹤的網頁元素埋設另一組代碼來做事件追蹤，一般為「點擊」追蹤。
1、安裝代碼埋設外掛
安裝此外掛「Header Footer Code Manager」，專門給GA追蹤來使用。
2、選好要追蹤的元素
找到想要追蹤點擊事件的元素，例如某按鈕、選單中的某選項…
不論是用什麼編輯器所設計的元素、按鈕都可以。
3、賦予此元素一個CSS的id或class類名。
(如果此元素已有內建可用的CSS id可直接取用，就不用再賦予)
▼替主選單的某一選項加上css類名
▼區塊編輯器的某一按鈕加上css類名
下圖例子的css類別命名為「addline」。
4、修改我準備好的代碼，埋入即可。
4.1 新增片段程式碼
例如以加Line好友的按鈕來做追蹤，按鈕的css類別已命名為「addline」。
4.2 貼上代碼範本，並修改第6、7、8那三行
- 第6行:那個按鈕的css類名，已命名為「addline」，此處填入「.addline」。
- 第7行:事件名稱，可任命名，我建議要有格式以利GA報表的檢視，可以用「myevent_click_XXXX」的格式，此處命名為「myevent_click_addline」。
- 第8行:事件標籤，可用中文命名，可不必在乎格式，主要知道用途或標示提醒。
<script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
<script>
$(document).ready(function() { // DOM 載入完成後才執行
// 自訂追蹤設定
var trackSelector = '.addline'; // 要追蹤的元素 (# 或 .)
var eventName = 'myevent_click_addline'; // 事件名稱
var labelName = '加line好友'; // 事件標籤
// 先給元素加 class
$(trackSelector).addClass("myga");
// 綁定點擊事件
$(document).on('click', trackSelector, function() {
gtag('event', eventName, {
'event_label': labelName,
'page_location': window.location.href
});
console.log('🎯 GA4 事件送出，並點擊觸發');
});
});
</script>
存檔。
PS : $(trackSelector).addClass(“myga”); →這句是我用來測試以上代碼是否有正常載入並運作，有正常運作的話該元素的css名稱會動態被新增一個css類名叫「myga」。
▼完成後
5、測試點擊
測試點擊，至GA後台觀察即時事件、報表。
在 即時報表（Realtime / 即時總覽） 中，事件會幾秒內出現。
但要在『標準報表』「管理 → 資料顯示 → 事件」中出現，通常需要 24 小時內（有時幾小時）。
