Script para disparar eventos de Google Analytics al pinchar en una clase o id.

Hace unos días hablamos sobre cómo usar los Eventos (Objetivos) de Google Analytics para los formularios de contacto de Contact Form 7.

Hoy os vamos a dejar una solución para las conversiones que funcionaría en cualquier otro tipo de formulario, o incluso al finchar en cualquier tipo de elemento web.

Lo que vamos a hacer es dejaros un script (que hemos usado) para que el evento se dispare cuando pinchemos en una clase o id, y eso mande el código a Google Analytics.

Código la pinchar en una clase o id.

Primero os dejo los códigos que, como siempre, podéis poner en WordPress en un Snippet o en el functions.php de tu tema hijo. En otro tipo de página podéis ponerlo como código Javascript.

Al pinchar en una clase.

add_action( 'wp_footer', function () { ?>
<script>
	document.addEventListener('click', function(e) {
   if (e.target.className == 'XXXX')
   {    gtag('event', 'aaaa', { 'event_category': 'bbbb', 'event_action': 'cccc',
'event_label': 'dddd', 'value': '0'});
}
		
		});
	</script>

Al pinchar en un id.

add_action( 'wp_footer', function () { ?>
<script>
	document.addEventListener('click', function(t) {
   if (t.target.id == 'YYYY')
   {    	gtag('event', 'aaaa', { 'event_category': 'bbbb', 'event_action': 'cccc',
'event_label': 'dddd', 'value': '0'});
}
	});
</script>

Explicación del código.

Como veis el código es muy similar. Ambos son scripts que se ponen en el pie de WordPress y están escuchando a ver si el usuario hace clic en alguno de los elementos que hemos puesto.

XXXX es la clase del elemento en la que queremos que “escuche”.
YYYY es la id del elemento en la que queremos que “escuche”.
Ambas pueden ser un botón, un enlace, un div o lo que queramos, por eso decimos que estos códigos sirven para cualquier elemento o formulario.

En la parte del gtag tenéis que poner en aaaa, bbbb, cccc, dddd, (y en el valor) los elementos que hayáis puesto al crear el elemento en Google Analytics.

Como antes, es fácil comprobar si funciona con el menú “Tiempo Real” de GA, haciendo pruebas y viendo la respuesta inmediatamente.
Pero como os digo nosotros hemos usado estos códigos varias veces sin problemas.