[GA4] Especificar selectores de CSS o variables de JavaScript (gtag.js)

Esta función forma parte de una beta abierta y está sujeta a cambios.

Estas instrucciones están dirigidas a los administradores y editores que quieren configurar la recogida de datos proporcionados por los usuarios y necesitan saber cómo identificarlos mediante la opción "Especifique los selectores de CSS o las variables de JavaScript" de la página "Permitir funciones de datos proporcionados por los usuarios".

Introducción

Debe actualizar el código en todas las páginas en las que recoja datos proporcionados por los usuarios; por ejemplo, una página de registro, de generación de oportunidades de venta, de tramitación de la compra u otra similar. Puede enviar los datos más de una vez en una sesión para asegurarse de que se mandan a Analytics.

Antes de empezar

En estas instrucciones se presupone lo siguiente:

• Ha activado la recogida de datos proporcionados por los usuarios y ha permitido las funciones de datos proporcionados por los usuarios.
• Tiene el rol Administrador en la propiedad de Google Analytics.

Identificar los selectores de CSS de los campos de datos proporcionados por los usuarios

Para identificar los selectores de CSS que quiere introducir en los campos, siga los pasos en cada uno de los campos. Si ya tiene variables que no estén cifradas con hash en el código, puede seleccionarlas en lugar de crear variables CSS. Obtenga más información en Configurar campos.

Nota: Si va a usar variables de JavaScript, lo más fácil será probablemente que pregunte al desarrollador qué variables debe introducir en estos campos. Si va a usar selectores de CSS, puede seguir los pasos que se indican a continuación.

1. Abra una ventana del navegador Google Chrome.
2. Acceda a su sitio web, pero sin cerrar Google Tag Manager.
3. Identifique los datos de clientes que quiere enviar a Google Analytics. Por ejemplo, si quiere enviar una dirección de correo electrónico, identifíquela en la página.
4. Haga clic con el botón derecho en el campo y seleccione Inspeccionar. Por ejemplo, si quiere recoger una dirección de correo, haga clic con el botón derecho en ella.
5. En la página de herramientas para desarrolladores de Chrome, verá una parte del código destacada. Este código es el elemento de página del que debe extraer los selectores de CSS referentes a los datos de clientes.
6. Coloque el cursor sobre el código destacado y haga clic con el botón derecho.
7. Desplácese hacia abajo hasta "Copiar" y, a continuación, seleccione Copiar selector.
8. Pegue el texto copiado en el campo correspondiente de Google Analytics o de Tag Manager.
   • El texto copiado debería tener un aspecto similar al siguiente:

     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.