Configura eventos

Los eventos te permiten medir las interacciones de los usuarios en tu sitio web o aplicación. Por ejemplo, puedes medir cuándo alguien carga una página, hace clic en un vínculo y realiza una compra. Google Analytics utiliza los datos de los eventos para crear informes con información sobre tu empresa. Más información

En esta guía, se muestra cómo configurar eventos recomendados y eventos personalizados en tu sitio web con la etiqueta de Google (gtag.js) o Google Tag Manager. No es necesario que configures eventos recopilados automáticamente ni de medición optimizada.

Público

Configuraste Google Analytics y comienzas a ver datos en tus informes, pero quieres recopilar más información de la que Analytics recopila automáticamente o quieres desbloquear ciertas funciones y capacidades en Analytics.


Antes de comenzar

En esta guía, se da por sentado que ya hiciste lo siguiente:

También se da por sentado que tienes lo siguiente:

  • Tienes acceso al código fuente de tu sitio web.
  • El rol de editor en la cuenta de Google Analytics

Descripción general de la etiqueta de Google (gtag.js)

Usa la API de la etiqueta de Google (gtag.js) para enviar eventos a Google Analytics. La API tiene una función llamada gtag(), y, cada vez que quieras enviar un evento a Google Analytics, debes usar la siguiente sintaxis:

gtag('event', '<event_name>', {
  <event_parameters>
});

En este ejemplo, la función gtag() incluye lo siguiente:

  • Un comando event que le indica a Google que estás enviando un evento
  • El nombre del evento recomendado o personalizado
  • (Opcional) Es una colección de parámetros que proporcionan información adicional sobre el evento.

Por ejemplo, el siguiente es un evento recomendado llamado screen_view con dos parámetros:

gtag('event', 'screen_view', {
  'app_name': 'myAppName',
  'screen_name': 'Home'
});

Agrega eventos a tu código JavaScript

gtag() es una función de JavaScript, por lo que debes agregarla al código JavaScript de tu página web. Por ejemplo, puedes agregar la función dentro de tus etiquetas <script> o en un archivo JavaScript independiente que importes a tu página HTML.

Puedes agregar eventos a tu código JavaScript en cualquier lugar debajo del fragmento de la etiqueta de Google. Google no procesará los datos de los eventos que coloques sobre el fragmento de la etiqueta de Google. Por ejemplo, el siguiente código de muestra incluye un evento llamado screen_view dentro de una etiqueta <script>:

<!DOCTYPE html>
<html lang="en">
<head>
    <!-- Google tag (gtag.js) -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX"></script>
    <script>
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());

    gtag('config', 'G-XXXXXXXXXX');
    </script>

    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Title of the page</title>
</head>
<body>
    <p>Welcome to my website!</p>
    
    <script>
      /**
      *   The following event is sent when the page loads. You could
      *   wrap the event in a JavaScript function so the event is
      *   sent when the user performs some action.
      */
      gtag('event', 'screen_view', {
        'app_name': 'myAppName',
        'screen_name': 'Home'
      });
    </script> 
</body>
</html>

Si deseas enviar el evento en función de un clic en un botón (o alguna otra acción del usuario), puedes agregar JavaScript adicional a tu evento.

Consulte sus eventos en Analytics

Puedes ver tus eventos y sus parámetros con los informes En tiempo real y DebugView. Ten en cuenta que el informe DebugView requiere cierta configuración adicional antes de que puedas usarlo. En estos dos informes, se muestran los eventos que activan los usuarios en tu sitio web a medida que se activan.

Próximos pasos

Anterior
Web
Siguiente
Agregar parámetros