This feature is part of an open beta. Keep in mind that the feature is subject to change.
以下の手順は、ユーザー提供データの収集を設定する予定で、[ユーザー提供データ機能を許可する] ページの [CSS セレクタまたは JavaScript 変数を指定する] オプションを使って、ユーザー提供データを特定する方法を習得したいとお考えの管理者と編集者を対象としています。
概要
ユーザー提供データを収集するすべてのページ（申し込みページ、見込み顧客発掘のページ、購入手続きページなど）でコードを更新する必要があります。セッション内でデータを複数回送信すると、データをアナリティクスに確実に送信できます。
始める前に
この手順は、以下の条件を満たしていることを前提としています。
- ユーザー提供データの収集を有効にし、ユーザー提供データ機能を許可している
- Google アナリティクス プロパティの管理者の役割を持っている
Identify CSS selectors for user-provided data fields
To identify the CSS selectors to input into the fields, complete these steps for each field. If you already have unhashed variables in your code, you can select those instead of creating new CSS variables.
Note: If you’re using JavaScript variables, it’s likely easiest to ask your developer which variables should be added to these fields. If you’re using CSS Selectors, you can follow the steps below.
- Open a Google Chrome browser window.
- Go to your website, but keep Google Tag Manager open.
- Identify the customer data you want to send to Google Analytics. For example, if you want to send an email address, identify where the email address is present on the page.
- Right click the field and select Inspect. For example, if you are trying to capture an email address, make sure you are right clicking the email address.
- On the Chrome Developer Tools page, you will see a portion of the code highlighted. This code is the page element where you need to extract CSS Selectors for the customer data.
- Hover your mouse over the highlighted code and right-click it.
- Scroll down to "Copy", then select Copy Selector.
- Paste the copied text in the corresponding field in Google Analytics or Tag Manager.
- The copied text should look something like the following:
tsf > div:nth-child(2) > div.A8SBwf > div.RNNXgb > div > div.a4bIc > custEmail
- The copied text should look something like the following:
Next steps
Validate that user-provided data collection is set up correctly. Show me how.