[GA4] Definir la configuración manual (Tag Manager)

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 identificar los datos proporcionados por los usuarios en su sitio web e introducirlos en Google Tag Manager.

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:

• Tiene acceso al contenedor de Tag Manager de su sitio web.
• Ha activado la recogida de datos proporcionados por los usuarios y ha permitido las funciones de datos proporcionados por los usuarios.
• Ha configurado una etiqueta Google Analytics: evento de GA4 en su contenedor de Tag Manager.

 Instrucciones

1. Inicie sesión en Google Tag Manager.
2. En la pestaña Espacio de trabajo, haz clic en la opción Etiquetas, situada a la izquierda.
3. Abra la etiqueta Google Analytics: evento de GA4 en la que recoge datos de clientes.
4. Despliegue la sección Parámetros de evento y haga clic en Añadir parámetro.
5. Escriba user_data en el campo "Parámetro de evento".
6. En el campo "Valor", seleccione o cree una variable de datos proporcionados por los usuarios.
7. En la variable Datos proporcionados por los usuarios, selecciona Configuración manual.
   
8. Despliegue el menú desplegable de cada campo y selecciona una variable.
9. Si crea una variable para un campo de datos, siga estos pasos:
   1. Haz clic en Configuración de la variable > Elemento DOM.
   2. Dé un nombre a la variable en la parte superior.
   3. En el campo Método de selección, elija Selector de CSS.
   4. En el campo Selector de elementos, introduzca el selector de CSS que hace referencia a los datos de clientes. Consulte cómo identificar los selectores de CSS en los campos de datos proporcionados por los usuarios.
   5. Deje en blanco el campo Nombre del atributo.
   6. Omita el campo Valor del formato para evitar posibles problemas de configuración.
   7. Guarde la variable Elemento DOM.
   8. Repita estos pasos con cada campo que quiera recoger.
10. En la variable Datos proporcionados por los usuarios, omita el campo Valor del formato.
11. Guarde la etiqueta de evento.
12. En la parte superior derecha, haz clic en Enviar para publicar los cambios.

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

Para identificar los selectores de CSS que debes introducir en los campos, sigue estos pasos en cada campo. Si ya tiene variables que no estén cifradas con hash en el código, puede seleccionarlas en lugar de crear variables CSS. Más información sobre 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. Abre una ventana del navegador Google Chrome.
2. Accede a tu sitio web sin cerrar Google Tag Manager.
3. Identifica los datos de clientes que quieres enviar a Google Analytics. Por ejemplo, si quieres enviar una dirección de correo electrónico, identifícala en la página.
4. Haz clic con el botón derecho en el campo y selecciona Inspeccionar. Por ejemplo, si quieres recoger una dirección de correo, haz clic con el botón derecho en ella.
5. En la página de herramientas para desarrolladores de Chrome, verás 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. Coloca el cursor sobre el código destacado y haz clic con el botón derecho.
7. Desplázate hacia abajo hasta "Copiar" y, a continuación, selecciona Copiar selector.
8. Pega el texto copiado en los campos "Especifica los selectores de CSS o las variables de JavaScript" en Google Analytics o en el campo "Selector de elementos" de la variable del elemento DOM en Google Tag Manager.
   • El texto copiado debe tener un aspecto similar a este:
     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.