medir los clicks

 

SEGUIMIENTO DE ENVÍOS DE FORMULARIO, CLICK EN BOTÓN Y DESCARGAS DE ARCHIVOS A TRAVÉS DE GOOGLE TAG MANAGER.

En este post aprenderás cómo medir los clicks que hacen los usuarios en los diferentes elementos de tu web, de manera muy sencilla. Configuraremos las etiquetas de seguimiento paso a paso,  para que no tengas ninguna duda, y sin necesidad de tocar el código html.

¿Por qué medir los clicks?

Las estrategias de marketing online no sirven de nada si no podemos medir sus resultados. De aquí la importancia que tienen ciertas herramientas de medición, que nos van a permitir optimizar la web y conseguir un mayor número de conversiones.

Una de las métricas más importante que existen y por tanto que hay que tener en cuenta es medir los clicks que hacen los usuarios en nuestra página. Es decir, contabilizar cuántos y en que enlaces pinchan.

Sin embargo, la configuración de estos seguimientos requiere de la inserción de códigos “etiquetas”, lo que nos asusta bastante si no tenemos ningún conocimiento de informática.

Por ello os traigo 3 casos prácticos que he utilizado en mi blog para medir los cliks de los usuarios, sin recurrir a la inserción de códigos, mediante la herramienta Google Tag Manager.

¿Qué es Google Tag Manager y para qué sirve?

GTM es una herramienta gratuita de Google que viene a simplificar la gestión de etiquetas. Nos va a permitir realizar un seguimiento y medición de cualquier elemento de nuestra web, sin necesidad de tocar el html.

logo google tag manager

En otras palabras, conseguiremos hacer un seguimiento de las conversiones de todas nuestras etiquetas de Analytics, Adwords, Remarketing… sin tener que acudir al código de nuestra web para incluirlas una a una. Además, podremos tenerlas todas juntas, pudiendo modificarlas, eliminarlas o introducir más con unos pocos clicks de ratón.

¿Y, qué son las etiquetas?

Son los fragmentos de código que nos permiten hacer el seguimiento de las conversiones: medir los clicks de envíos de formularios, medir los clicks de descarga de archivos, las imágenes o banners visualizados…

¿Por qué usar GTM?

La principal ventaja de utilizar GTM es la posibilidad de poder implementar y tener mayor control de nuestras etiquetas de seguimiento, sin tener conocimientos de programación.

En muchas ocasiones, introducir los códigos de seguimiento de analytics o adwords a los elementos de la web, puede resultar misión imposible. De esta manera, seremos más autónomos en la gestión de las mediciones sin necesidad de recurrir a programadores.

Yendo al grano, a continuación, os detallo cómo podéis instalar GTM y posteriormente realizaré 3 ejemplos sencillos, paso a paso, para medir dónde hacen click los usuarios.

Es importante que tengáis previamente instalado GA, ya que lo necesitaremos para visualizar nuestras conversiones. En caso que no lo tengáis instalado, al final del post, os dejo un enlace a un video, que lo explica de manera muy sencilla, y que no os llevará más de 5 minutos.

Instalación de Google Tag Manager (GTM)

Lo primero que tenemos que hacer es instalar GTM para nuestra página.

1º Vamos a la página de google tag manager https://tagmanager.google.com/#/home y le damos a “crear cuenta”.

medir-clicks-google-tag-manager

2º A continuación, se abre un desplegable donde simplemente tendremos que poner el nombre que le queremos dar a la cuenta, en mi caso, el nombre de mi blog, y el país, y le damos a continuar.

3º Ahora procedemos a la configuración del contenedor. Tendremos que escribir nuestra web, y donde lo vamos a utilizar, en este caso “sitio web”.

4º Al darle a crear nos aparecerán el contrato de google. Aceptamos las condiciones y le damos a “si”.

Por último, sale una pantalla con dos contenedores de código, que será lo único que tocaremos al respecto.

configuracion etiquetas tag manager

Copia el primer código y ves al editor de código de tu página. Si utilizas wordpress, lo tendrás en apariencia > editor.

Una vez dentro iremos al panel de la derecha y buscaremos la cabecera del tema “header.php”. Pincha en ella, y busca en el código la etiqueta <head> (que no <header>). Pega justo debajo de esta etiqueta el código anterior y dale a actualizar.

De la misma forma, vamos de nuevo a tag manager y copiamos el segundo contenedor de código, y en la cabecera del tema “header.php” (igual que antes) buscamos la etiqueta <body> y pegamos este código justo debajo.

Le damos a actualizar el archivo

configuracion tag manager

YA TENEMOS ACTIVADA NUESTRA CUENTA EN  GOOGLE TAG MANAGER!

Ahora sí, vamos a ver cómo medir los clicks en nuestra web con los siguientes CASOS PRÁCTICOS.

Caso práctico 1: seguimiento de envíos de formulario

En nuestro panel central de GTM, vamos a crear un evento, como en analytics pero sin tocar código de la web, lo que nos va a permitir medir los clicks de envío. Es decir, podremos saber el número de formularios que nos han enviado sin necesidad de crear una página de agradecimientos

medir-clicks-google-tag-manager

    Paso 1:creamos la etiqueta para el formulario.

Al darle a nueva etiqueta nos aparecerá la siguiente pantalla:

medir-clicks-google-tag-manager

Ponemos un nombre a la etiqueta, por ejemplo, “envioformulario” y clicamos en la configuración de la etiqueta.

Nos pedirá que elijamos un tipo de etiqueta. Como las que vamos a usar son todas de analytics, escogeremos la que pone “universal analytics”.

Seguidamente, nos aparecen unos desplegables. El primero de ellos nos pide que seleccionemos que tipo de seguimiento vamos a hacer: si es para una página vista, para un evento, para el tiempo de duración del usuario…

Para este ejemplo elegiremos “evento”

Rellenamos los campos que nos indican, lo que nos servirá para organizar nuestros eventos.

En el segundo de los desplegables, tenemos que introducir la configuración de google analytics (GA). De otra forma sino, los datos no quedarían registrados y no podríamos hacer el seguimiento.

Pinchamos en el desplegable y seleccionamos “nueva variable”.

Aparecerá otra pantalla en la que únicamente tendremos que ingresar el código identificador de analytics.

Este identificador lo puedes encontrar accediendo a tu cuenta de GA en administrar > propiedad > configuración de la propiedad.

medir los clicks tag manager

La nombramos y le damos a guardar. Yo le he puesto el nombre de “idanalytics”.

Esta variable se quedará guardada en GTM, así, en posteriores eventos no hará falta volver a introducir el código de analytics.

    Paso 2: configuramos el activador.

Una vez tenemos creada la etiqueta, no basta para que se ponga en funcionamiento. Es necesario generar un activador. Es decir, vamos a introducir una serie de normas que van a indicar cuando queremos que se ejecute el evento que hemos creado.

Siguiendo con la pantalla, pinchamos en el cuadro “activación”:

Aquí nos salen los activadores que ya hemos creado en eventos anteriores, pero si no es así, pincharemos en el más para configurar uno nuevo.

Pinchamos en el cuadro configuración del activador y entre las opciones que aparecen, escogeremos la de “envío de formulario” para este supuesto.

Le ponemos un nombre, y le damos a guardar.

También ofrece la posibilidad de que solo se active en determinados formularios, pero eso lo veremos para el siguiente caso práctico de “click en un botón determinado”, ya que el procedimiento para hacer la selección es la misma.

En este ejemplo, dejaremos marcada la opción “todos los formularios”.

De todas formas, sabremos de que página procede, ya que al crear la etiqueta hemos puesto que nos indique la URI de procedencia “page path”.

medir los clicks tag manager

Por último, damos a guardar a todas las pantallas que nos aparecen y solo faltaría darle al botón “enviar”, que se encuentra en la parte superior derecha. Es importante recalcar esto, ya que, si no le das, no va a funcionar.

Pero antes de enviar, podemos hacer una prueba con la “vista previa”.

¿Cómo verificamos que funciona correctamente?

Vamos a la pestaña “vista previa”, lo que nos va a permitir que, con nuestro navegador, hagamos una prueba para saber si está funcionando correctamente antes de enviarlo o en su defecto, hacer algunas modificaciones.

medir los clicks tag manager

Accedemos a nuestra web en una nueva ventana, y nos aparecerá una pantalla inferior:

Podemos probar a realizar un envío de formulario, hacer click en un botón, click para descargar un archivo o el evento que hayamos creado.

Si todo funciona correctamente, la etiqueta se accionará, y se reflejará en este panel inferior de GTM:

Finalmente, volvemos a GTM, le damos a salir del modo vista previa, y lo publicamos.

Se publica con el botón superior de la derecha“enviar”. Saltará una pantalla para que le indiques un nombre de la versión y una descripción. Aquí puedes poner lo que quieras, de la forma en que mejor te vayas a aclarar. En mi caso he puesto en el nombre “versión 1” y en la descripción, envío de formulario.  Y PUBLICAR!!!

Comprobación en Google analytics

Para comprobar en GA el evento que acabamos de crear, realiza la acción del evento en tu web y a continuación accede a GA > “en tiempo real” > eventos.

Aunque por el momento solo puedes visualizarlo en esa pestaña, pasadas unas horas, podrás encontrar todos los eventos que hayas creado, en “comportamiento > eventos”.

Caso práctico 2: medir los clicks en un botón.

En este ejemplo vamos a crear un evento para el click en un botón de nuestra web.

Los pasos a seguir son los mismo que en el caso anterior, lo que va a cambiar es el activador.

Pero antes de empezar, es preciso que configuremos algunas variables de GTM, porque por defecto solo aparecen las predeterminadas.

Paso 1: configuramos las variables.

En la pantalla principal aparecen a la derecha una serie de carpetas. Pinchamos en la que pone variables y pulsamos en configurar.

Accedemos a nuestra web en una nueva ventana, y nos aparecerá una pantalla inferior:

Nos saldrá una pantalla con una serie de variables seleccionadas (las predeterminadas) y otras no. Vamos a seleccionar también las siguientes:

Puedes escoger todas aquellas que creas que vas a necesitar. Pero para el caso que nos ocupa son más que suficientes. De hecho, solo usaremos dos.

Paso 2: creamos la etiqueta para el botón.

Volvemos a la pantalla principal y pinchamos en “nueva etiqueta”> “configuración de la etiqueta”> le damos un nombre y rellenamos los campos igual que en el supuesto anterior:

Paso 3: configuramos el activador.

Picha en configuración del activador y pulsa en el símbolo más que aparece arriba a la derecha > click en configuración. Entre las opciones disponibles, le daremos a “todos los elementos”.

A continuación, nos aparecen dos opciones: “todos los click” y “algunos clicks”. Si seleccionamos la primera, el activador actuará cuando nuestros usuarios hagan click en cualquier botón de nuestra web. Pero como sólo nos interesa que nos cree el evento en un determinado botón, escogeremos la opción “algunos clicks”.

En el primer desplegable existen múltiples alternativas para indicar que botón nos interesa. Elegiremos de entre ellas “click text”. En  los otros dos campos, simplemente tendríamos que poner que este botón “es igual a” y “el texto que figure en tu botón”, ya sea “solicitar”, “comprar”, “enviar”…

Muy importante es que tengas en cuenta que pongas exactamente igual el texto de tu botón, ya que una mayúscula mal puesta haría que el activador no detectase el botón.

Ponemos un nombre al activador, ya que nos puede servir posteriormente para otras etiquetas, guardamos y listo!

En el caso de que dispongas de varios botones con el mismo texto, existen otras opciones como “click id” “click classes” “click element”… que pondrán solucionarte este problema. En el siguiente caso práctico utilizaremos el “click clasSes”.

Paso 4: comprobamos que funciona correctamente.

La forma de verificar que funciona correctamente, se hace exactamente igual que en el supuesto anterior.

Caso práctico 3: medir los clicks de descarga

Cuando uno de nuestros objetivos es que descarguen un archivo de nuestra web, querremos medir cuando los usuarios hacen click en la descarga. Para configurar este objetivo, muy similar al anterior, seguiremos estos sencillos pasos:

Paso 1: creamos la etiqueta para el clikc de descarga. 

Damos click en “crear etiqueta” > le damos un nombre, por ejemplo  “descarga de archivos” > y pichamos en configuración de la etiqueta.

Elegimos la etiqueta de “universal analytics” y rellenamos los campos de la misma forma que en los supuestos anteriores. Únicamente he cambiado el nombre de la categoría.

Paso 2: configuramos el activador.

Picha en configuración del activador, pulsa en el símbolo más que aparece arriba a la derecha y en este caso escoge “solo enlaces”.

Accedemos a nuestra web en una nueva ventana, y nos aparecerá una pantalla inferior:

Ahora nos aparecen dos opciones:

configuracion etiquetas tag manager

Si queremos que para cualquier enlace nos cree un evento, le daremos a “todos los clicks en enlaces”. En este caso, esta opción no te la recomiendo porque en general, nuestras webs están llenas de enlaces a nuestras páginas, archivos, imágenes… y no nos proporcionaría una medición detallada de lo que queremos realmente medir.

Por ello, seleccionaremos “algunos clicks en enlaces” e introducimos la regla que queremos que cumpla el activador para que nos cree el evento. En mi caso, quiero que se active sólo en los enlaces que tengan el siguiente icono de descarga, que es el que utilizo en mi web.

icono descargas

configuracion etiquetas tag manager

En el primer desplegable, nos ofrece una serie de variables con la que podremos definir en qué tipo de enlace queremos que actúe el activador (variables que hemos configurado en el caso anterior, ya que por defecto no aparecen todas). Yo he utilizado la opción “click Classes”, es decir, voy a usar la clase del enlace para indicarle que solo se active en esos iconos. ¿De dónde obtenemos la clase del enlace? Pues bien, vamos a nuestra página y nos situamos en el icono en el que queremos crear el evento. Pulsamos botón derecho del ratón y damos a inspeccionar.

Te aparecerá una pantalla como esta:

configuracion etiquetas tag manager

Tendremos que buscar en la pantalla de la derecha la clase del enlace, que vendrá a ser <a class = “la clase de tu enlace” href= “la dirección del enlace”> (verás que cuando te sitúes encima de ella, tu icono o enlace cambiará de color).

Copiamos la clase del enlace y la pegamos en el tercer desplegable.

Por último, le ponemos un nombre y le damos a guardar.

Paso 3: comprobamos que funciona correctamente.

imagen nueva

Ahora ya puedes medir los clicks de los usuarios de tu web.

Gracias a Google Tag Manager podremos crear los eventos que queramos sin necesidad de insertar códigos. Además, podremos modificarlos fácilmente y gestionarlos desde la plataforma.

Saca rendimiento a esta funcionalidad y comienza a crear tus eventos. Práctica y experimenta con la herramienta, ya que, si te equivocas, basta con eliminar la etiqueta. De esta forma podrás obtener un mejor rendimiento futuro de tus conversiones.

Aquí os dejo el enlace al video de Fernando Martin “como instalar analytics en wordpress en un minuto”

 

¿Cómo medir los clicks de mi web? Casos prácticos paso a paso sin conocimientos previos

Un pensamiento en “¿Cómo medir los clicks de mi web? Casos prácticos paso a paso sin conocimientos previos

  • 22 abril 2018 a las 19 h 28 min
    Enlace permanente

    Gracias por el tutorial porque yo que soy un poco torpe en estos temas me he podido aclarar.
    Un saludo

    Responder

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *