Insertar etiqueta de eventos de Google Analytics

Google Analytics permite medir acciones específicas dentro de un sitio web, logrando una personalización en los informes. Estas acciones se conocen como «eventos» y requieren un marcado extra.

En este artículo revisaremos cómo incluir esta función en formularios y enlaces, independiente del código de Google Analytics que se esté usando para la medición de impacto.

Entiendo el código

Para integrar los eventos es necesario agregar una instrucción JavaScript sobre el elemento HTML que desea medirse. Esta instrucción está conformada por cuatro variables. Ellas son:

• CATEGORY: Es el nombre que se asigna al conjunto de elementos comunes a los que se realiza seguimiento.
• ACTION: Es como se denomina la interacción a la que se realiza seguimiento.
• LABEL: Información específica del elemento al que se realiza seguimiento.
• VALUE: Es el valor de medición. Puede ser numérico, monetario, temporal.

En la explicación de este artículo se utilizarán los siguientes datos:

• CATEGORY: publicidad
• ACTION: clic
• LABEL: epm
• VALUE: 1

El código base de seguimiento

Como se mencionó anteriormente, existen dos maneras de integrar Google Analytics a un sitio o página web: analytics.js y gtag.js. Es importante que conozca cuál método está implementado en su sitio web.
Para analytic.js se utiliza este código:

ga('send', 'event', 'category', 'action', 'label', value);

Así, teniendo presente los valores expresados, el código ya personalizado sería:

ga('send', 'event', 'publicidad', 'clic', 'epm', 1);

Por su parte, el código de gtag.js es:

gtag('event', 'action', { 'event_category': 'category', 'event_label': 'label', 'value': 'value'});

Su personalización sería:

gtag('event', 'clic', { 'event_category': 'publicidad', 'event_label': 'epm', 'value': '1'});

Insertar código JS a un formulario

Para este ejemplo, el evento tendrá lugar una vez el usuario envíe los datos ingresados en el formulario.

Para la versión analytic.js se define un formulario con el siguiente parámetro:

<form action="#" method="post" onsubmit="ga('send', 'event', 'publicidad', 'clic', 'epm', 1);">

La version gtag.js:

<form action="#" method="post" onsubmit="gtag('event', 'clic', { 'event_category': 'publicidad', 'event_label': 'epm', value': '1'});">

¿Necesitas asesoría en comunicación digital?

Diseña y optimiza tus proyectos en comunicación digital, entregando una mejor experiencia a tus usuarios y potenciando el valor de tu marca.
Conversemos

Insertar evento en un enlace

El proceso es muy similar al formulario. La diferencia está en el parámetro de etiqueta. Para los enlaces se utiliza el comportamiento onclick si se quiere que el evento tenga lugar una vez el usuario presione el enlace.

La versión analytics.js:

<a href="#" onclick="ga('send', 'event', 'publicidad', 'clic', 'epm', 1);">Rótulo de navegación</a>

Para gtag.js

<a href="#" onclick="gtag('event', 'clic', { 'event_category': 'publicidad', 'event_label': 'alcaldia', 'value': '1'});">Rótulo de navegación</a>

Proceso en video

En este video de mi canal YouTube explico el procedimiento, utilizando un sitio web real soporta en WordPress.

En el canal YouTube «juancadotcom» puedes encontrar más videos sobre el tema.

¿Tienes una pregunta sobre el artículo? Cuéntame en los comentarios. Además, si quieres que escriba sobre algún tema, anótalo a continuación para agregarlo a la agenda de contenidos.

Tu aporte permite crear contenidos. Envía un aporte Nequi

Hay más posibilidades. Apoya el blog desde PayPal.me

¡Vamos por los 10.000 suscriptores en YouTube! Suscríbete

—

Por:
Juan Carlos Morales S.
Comunicador y educador
YouTube | LinkedIn | Instagram | Twitter

Insertar etiqueta de eventos de Google Analytics por juancadotcom se distribuye bajo una Licencia Creative Commons Atribución-CompartirIgual 4.0 Internacional. Basada en una obra en https://e-lexia.com/blog.