[GA4] Especifique seletores CSS ou variáveis JavaScript (gtag.js)

Esta funcionalidade faz parte de uma versão beta aberta e está sujeita a alterações.

Estas instruções destinam-se a administradores e editores que estão a configurar a recolha de dados fornecidos pelos utilizadores e querem saber como os identificar através da opção Especifique seletores CSS ou variáveis JavaScript na página Permita capacidades de dados fornecidos pelos utilizadores.

Vista geral

Deve atualizar o código em todas as páginas onde recolhe dados fornecidos pelos utilizadores, como uma página de inscrição, uma página de geração de leads, uma página de pagamento ou algo semelhante. Pode enviar os dados mais do que uma vez numa sessão para garantir que são enviados para o Analytics.

Antes de começar

Estas instruções pressupõem que:

• Ativou a recolha de dados fornecidos pelos utilizadores e permitiu as capacidades de dados fornecidos pelos utilizadores
• Tem a função de administrador na propriedade do Google Analytics

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. Learn more about Fields to set.

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.

1. Open a Google Chrome browser window.
2. Go to your website, but keep Google Tag Manager open.
3. 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.
4. 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.
5. 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.
6. Hover your mouse over the highlighted code and right-click it.
7. Scroll down to "Copy", then select Copy Selector.
8. 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

Next steps

Validate that user-provided data collection is set up correctly. Show me how.