Nuestro Blog

Manuel Piquer Estudio

Conversión, Transacciones con Google Analytics, Tag Manager y PrestaShop

Me he leído muchos tutoriales y no quedaba claro como trabajar con Prestashop y Google Tag Manager para reflejar las transacciones en Google Analytics.

Creo este tutorial para ayudar a aclarar definitivamente como hacerlo de forma sencilla, para ello he creado un modulo que añade las etiquetas de Google tag manager en Prestashop y crea el un DataLayer en la pagina de confirmación de  pago.

Estate atento y no te pierdas iremos pando de Tag Manager a Analytics para crear las variables y final mente instalaremos el modulo en Prestashop.

Configuración de Google Tag Manager

Comenzaremos dándonos de alta en nuestra cuenta de Google Tag Manager.

Una vez nos hayamos dado de alta, tendremos que crear la cuenta de nuestra tienda

 

Y configuramos los parámetros como podemos ver en el siguiente ejemplo:

Al finalizar este proceso y aceptar las políticas de Tag Manager para la creación de cuentas, se nos abrirá un popup con dos códigos de seguimiento.

Si has cerrado la ventana sin darte cuenta, podrás volver a ver los datos en Administrador > Instalar Tag Manager.

Como nosotros contamos con el modulo de PrestaShop, solo vamos a proceder a incluir el ID de  Google Tag Manager GTM-XXXXXX, sin necesidad de tocar código en la plantilla, además he añadido un script casero, que incluye el ID de usuario y su email en caso de estar logueado, y que en los próximos pasos os explicaré su función.

Vamos a Analytics
Configurar dimensiones personalizadas en Google Analytics (GA)

Si accedemos a nuestra propiedad de Google Analytics, y le damos a administrar, veremos que en la columna de propiedad tenemos la opción de definiciones personalizadas > dimensiones personalizadas

Una vez allí creamos las dimensiones personalizadas con el nombre de Usuario y Email y el ámbito Hit.

Para que estas dos nuevas dimensiones, recojan los datos de Prestashop y Tag Manager y se muestren en Analytics, debemos configurar las variables en Tag Manager, para ello vamos a Google Tag Manager y en el apartado variables >>  variables definidas por el usuario, creamos una nueva de  tipo Variable de capa de datos:

Para que la configuración nos quede así:

Creamos una variable  con emailUsuario y otra con userID.

Captar datos de Prestashop en Tag Manager

Volvemos a nuestro espacio de trabajo de Google Tag Manager y añadimos una nueva etiqueta:

Nos aparecerá una ventana que nos dará elegir entre configurar etiqueta o activador,

Seleccionamos configurar etiqueta y a continuación indicamos que es de tipo Google Analytics.

El tipo de seguimiento será página visita y en configuración de Configuración de Google Analytics

configuramos nueva variable y configuramos lo siguiente:
Donde UA-XXXXXXXXX-Y será nuestro ID de Google Analytics que queramos asociar al Tag Manager para recibir los datos

Para las dimensiones personalizadas, bastará con darle al botón de la cajita y nos aparecerán las variables definidas en el paso anterior, tal y como muestra la imagen:

Y una vez guardemos la configuración, solo nos quedará decir que el activador será para todas las páginas y nos debería quedar la configuración así:

 

La Configuración de nuestro modulo Google Tag Manager para PrestaShop

Comenzaremos instalando el modulo Google Tag Manager. que he creado y es de uso libre.

Como veréis es bien sencillo de configurar, solo tienes que añadir tu ID GTM-XXXXX y asignar un nombre al Datalayer,
si ya tuvieras las etiquetas de Google tag manager creadas en otro modulo o pegadas en el header.tpl , también tienes la opción de anular las que incluyo en este modulo para no duplicar y dejar solo habilitados  los  Datalayer, que harán la comunicación de Prestashop, para que le envíe datos del pedido a Google Tag Manager.

 

Enviar las conversiones de compras de Prestashop a Google Tag Manager y Google Analytics

Y ahora cuando se realiza una confirmación de compra 0 order-confirmation , todas las compras que se realicen en nuestra tienda con los pagos por Transferencia o TPV, se enviarán a Google Tag Manager.
Para reflejarlas en Google Analytics, tendremos que crear un activador en Tag Manager al que le pondremos el nombre de ConfirmacionDeCompra tal y como la hemos llamado en nuestro modulo de PrestaShop.

Y para tambien creamos una nueva etiqueta de tipo Google Analytics, con seguimiento de transacción donde el activador será el que acabamos de crear para el evento tra ConfirmacionDeCompra

Ahora que ya tenemos todo configurado, solo queda publicar los cambios, para eso, le damos al botón azul ‘ENVIAR’ que está situado en Tag Manager arriba a la derecha.

Y creamos la versión con un nombre y descripción, le damos a publicar y habremos finalizado nuestra configuración.

Para comprobar que todo está correcto, vamos a Google Analytics > Conversiones > Comercio Electrónico >Visión General y si todo ha ido correctamente empezaremos a ver reflejadas las transacciones y ventas de la tienda, aunque cabe recordar que al principio pueden tardar unas horas en ser mostradas.


Y hasta aquí el tutorial!, espero haber ayudado.
Otros Articulos