Google Tag Manager追蹤使用者複製行為

更新時間：2024年6月9號

這次分享的是用GTM追蹤使用者的複製行為，主要是使用者複製頁面上的一些文字，例如複製郵箱，電話。

原理是透過自訂HTML注入javascript，監聽使用者是否有複製行為，如果有，透過dataLayer.push發送資訊，複製的文字和文字長度透過資料層變數傳遞，發給GA4。

Step 1：自訂HTML注入javascript

在GTM中點擊「代碼」——「新建」——「選擇一個代碼類型以開始設定…」——「自訂HTML」，命名為“HTML-Copy”，將程式碼貼進入，觸發條件選擇“All Pages”，設定後的效果如下：

Code：

<script>
// Declare function to get selected text from document
function getSelectionText() {
    var text = "";
    if (window.getSelection) {
        text = window.getSelection().toString();
    } else if (document.selection && document.selection.type != "Control") {
        text = document.selection.createRange().text;
    }
    return text;
}
 
// Declare function on copy event
document.addEventListener("copy", function(e){
  dataLayer.push({
    "event": "textCopied",
    "clipboardText": getSelectionText(),
    "clipboardLength": getSelectionText().length
  });
});
</script>

如果想只追蹤複製郵件或電話號碼，可以做些限制，加個判斷，複製的文字等於特定的值，才發送事件。

Step 2：設定觸發條件

在GTM中點選「觸發條件」—「新建」—「選擇一個觸發條件類型以開始設定…」—「自訂事件」，命名為“textCopied”，然後做以下設定：

Step 3：設定資料層變數

在GTM中點選「變數」—「新建」—「選擇一個變數類型以開始設定…」—「資料層變數」，命名為“DL – Clipboard Text”，然後做以下設定：

同理設定DL – Clipboard Length：

Step 4：設定代碼

在GTM中點擊「代碼」——「新建」——「選擇一個代碼類型以開始設定…」——「Google Analytics（分析）：GA4 事件」，命名為“GA4-複製事件演示”，然後做如下設定：

事件名稱命名為TextCopy

同時定義了兩個事件參數TextCopy_text和TextCopy_length去傳遞複製的內容和內容長度

Step 5：預覽調試

接著就是預覽調試，如果你不會調試，請看：新版Google Tag Manager 預覽模式指南——Tag Assistant

事件正常觸發，可以點選打開看裡面的value是否準確：

數據準確，可以發佈到線上。

Step 6：註冊事件參數

前面我們設定了事件參數TextCopy_text和TextCopy_length，接下來需要在GA4中註冊事件參數，由於TextCopy_text是文字型，所以註冊為自訂事件等級自訂維度，TextCopy_length是數值型，所以註冊為自訂事件等級自訂定義指標。

註冊自訂維度TextCopy_text

在GA4中點選「管理」－「自訂設定」－「建立自訂維度」，然後做以下設定：

註冊自訂指標TextCopy_length

在GA4中點選「設定」－「自訂設定」－「自訂指標」－「建立自訂指標」，然後做如下設定：

這樣就設定完成了。

Step 7：報告查看

一般是24小時後，可以在GA4看到資訊，如：