這項功能屬於公開測試版功能,可能會有變動。
以下操作說明適用於想要設定「收集使用者提供的資料」功能的管理員和編輯者,可協助他們瞭解如何透過「允許納入使用者提供的資料」頁面上的「指定 CSS 選取器或 JavaScript 變數」選項,找出使用者提供的資料。
總覽
我們建議您對收集使用者提供資料的所有頁面更新程式碼,例如註冊、待開發客戶產生、結帳頁面或類似頁面。您可以在一個工作階段中多次傳送資料,確保資料能傳送至 Analytics。
事前準備
這些操作說明假設您已具備下列條件:
- 已啟用「收集使用者提供的資料」功能,並允許納入使用者提供的資料
- Google Analytics 資源的管理員角色
找出使用者提供資料欄位的 CSS 選取器
請分別為各個欄位完成下列步驟,找出要輸入欄位的 CSS 選取器。若程式碼中有未經雜湊處理的變數,您可以選取這些變數,不需要建立新的 CSS 變數。若想進一步瞭解需要設定的欄位,請參閱這篇文章。
注意:如果您使用 JavaScript 變數,最簡單的方法可能是直接向開發人員確認該將哪些變數加進這些欄位。若您使用 CSS 選取器,請按照下方步驟操作。
- 開啟 Google Chrome 瀏覽器視窗。
- 前往您的網站 (讓 Google 代碼管理工具保持開啟)。
- 找出要傳送至 Google Analytics 的顧客數位資料。舉例來說,如果要傳送電子郵件地址,請找出網頁上顯示電子郵件地址的位置。
- 對著欄位按一下滑鼠右鍵,然後選取「檢查」。假設您要擷取電子郵件地址,請務必對電子郵件地址按一下滑鼠右鍵。
- Chrome 開發人員工具頁面會醒目顯示部分程式碼,也就是網頁元素,您需要從中擷取顧客數位資料的 CSS 選取器。
- 將滑鼠游標懸停在醒目顯示的程式碼上,然後按一下滑鼠右鍵。
- 向下捲動至「複製」,然後選擇「複製 selector」。
- 將複製文字貼進 Google Analytics 或代碼管理工具中的對應欄位。
- 複製文字看起來像這樣:
tsf > div:nth-child(2) > div.A8SBwf > div.RNNXgb > div > div.a4bIc > custEmail
- 複製文字看起來像這樣:
Next steps
Validate that user-provided data collection is set up correctly. Show me how.