Google Tag Manager y WordPress: Preguntas Frecuentes
1. ¿Cómo podemos añadir Google Tag Manager en WordPress?
Hay numerosos plugins para hacerlo. Pero si priorizamos la optimización de la velocidad de carga sobre todo, y deseamos que el contenedor esté forzosamente al principio del body (para mayor eficiencia); lo más sencillo es incluirlo “a mano”, vía código, en la propia estructura de plantillas de WordPress.
Para encontrar el punto donde debes colocar el código, dirígete a Apariencia / Editor / Cabecera (header.php).
Una vez abierto el archivo, hay que buscar la etiqueta de apertura de <body>, que en WordPress quedará parecida a ésta:
Inserta a continuación el fragmento de código del contenedor de Google Tag Manager (lo tienes en GTM / Administrador / Instalar GTM):
A partir de ahí, la configuración y casi todas las implementaciones avanzadas, como ya sabes, la realizarás desde Tag Manager.
2. ¿Qué pasa con el plugin Contact Form 7 y Google Tag Manager? ¿No funciona el procesador de envíos de formulario?
Seguro que algunos de vosotros, como yo misma, habéis probado a generar eventos de envío de formulario con el procesador de envíos de formulario en Google Tag Manager (uno de los procesadores de eventos automáticos incluidos por defecto).
Vale, pero lo hacéis, ¿y qué ocurre? ¡pues que no funciona! o bien no se genera ningún evento, o bien se genera aunque se rellene mal el form y no llegue a producirse ningún envío real. Esto os ocurrirá en más de una ocasión, no solo con Contact Form 7…
Los motivos técnicos del por qué me superan (solo sé tiene que ver con el tipo de programación del formulario); pero por suerte, existe una solución, enviar un evento personalizado justo en el envío correcto 🙂
<script>
window.dataLayer = window.dataLayer || [];
dataLayer.push({
'event': 'formSubmitOK'
});
</script>
Cómo hacerlo en este caso particular: el propio plugin Contact Form 7 cuenta con un campo “Configuración adicional”, en el cual podemos añadir una función de dicho plugin, llamada “on_sent_ok”; que es la que define qué tiene que ocurrir cuando se realiza el envío correcto del formulario.
Por ejemplo, si ponemos en dicho campo:
on_sent_ok: “location.replace(‘/contacto/gracias’);”
al enviarse el formulario correctamente, nos llevará a una página de gracias con URI: “/contacto/gracias”, que deberíamos crear previamente.
Aunque con esto podría ser más que suficiente para realizar un seguimiento de los contactos recibidos; en nuestro caso lo que queríamos, es que al enviarse correctamente el formulario, se mande un evento personalizado a Google Tag Manager, para lo que hemos de poner:
on_sent_ok: “dataLayer.push({‘event’: ‘formSubmitOK’});”
donde “formSubmitOK” puede ser cualquier otra cosa, ya que es el nombre de nuestro evento personalizado y hemos decidido llamarlo así.
Y con el “dataLayer.push”, lo que hacemos es añadir a nuestra dataLayer de Google Tag Manager una línea: el evento personalizado de envío de formulario, justo cuando queremos, cuando éste se realiza correctamente.
Finalmente, el activador para lanzar etiquetas en formularios con evento concreto:
Esta regla de activación podremos utilizarla para la activación de cualquier etiqueta de conversión (AdWords, Marin Software, DoubleClick…), además de, por supuesto, para enviar si lo deseamos, un evento a Google Analytics.
3. ¿Y si no sé, o no puedo, editar el código directamente? ¿Cómo inserto Google Tag Manager en WordPress?
Hay un plugin de WordPress que pinta muy muy bien para exprimir Google Tag Manager al máximo, sin tener muchas nociones de programación y sin apenas tocar código ni dataLayer. Se llama DuracellTomi’s Google Tag Manager for WordPress.
Entre otras cosas, crea su propia dataLayer e incluye funcionalidades extra, por ejemplo:
- Variables de dataLayer para post/page titles, dates, category names, tag names, author names, post types, search data…
- Eventos en enlaces externos, de descarga, de email, movimientos entre campos de formulario, clicks en botones de compartir en Redes sociales…
- Tracking automático del Scroll de página
- Fácil creación de dataLayer de Remarketing dinámico de AdWords y de las múltiples dataLayers para Enhanced Ecommerce de Google Analytics; gracias a su potente integración con WooCommerce
- Integración automática con el plugin Contact Form 7, generación de evento personalizado en el envío correcto (similar a lo que comentamos en la pregunta 2)
La única pega de este plugin, es que inserta el código antes del final del </body> (y no al principio). Esto es porque WordPress por defecto no tiene un punto de inserción de código (hook) tras la apertura del <body> y, por ello, la mayoría de plugins, lo insertan al final.
Pues bien, incluso esto lo ha tenido en cuenta quien ha creado el plugin y, por ello, en su FAQ, da la explicación de cómo, también, es posible insertar directamente el código de GTM en el archivo header.php para ponerlo al principio del <body>, y seguir trabajando con DuracellTomi’s Google Tag Manager for WordPress. Es parecido a lo que explicamos en la pregunta 1, solo que insertando la línea php que sugiere en su faq, ya que lo hace con una función:
Por otro lado, en nuestro Grupo de Google Tag Manager en Linkedin, se propuso un plugin para insertarlo en el lugar correcto. La idea está muy bien pero, como su propio creador dice, ralentiza la carga… seguro que WordPress en breve mejora esta carencia que tiene actualmente.
4. ¿Qué ocurre si inserto el contenedor de Google Tag Manager al final del </body> y no al principio?
Las etiquetas no se activarán hasta que termine de cargar la página, con lo que ello implica: es más ineficiente y además, podría dar problemas con algunas etiquetas.
5. Enviar Autor del post, Categoría y User-Id de WordPress a Google Analytics (con GTM)
En el siguiente artículo sobre Dimensiones Personalizadas de Google Analytics explicamos de forma sencilla varios ejemplos para generar enviar valores de dimensiones personalizadas desde WordPress vía código de dataLayer (sin plugins):
Gracias por tu ayuda Aitor!!!!
Cap. 11 – Remarketing con datos demográficos con GA Cap. 13 – GTM para agencias de publicidad
Comments