Configurar objetivos en analytics con Contact Form 7

Aquí tienes una guía paso a paso para configurar los objetivos de Google Analytics en tus formularios de contacto de Contact Form 7 en WordPress.

Todos sabemos la importancia de medir el porcentaje de conversión de nuestras página web. Una de las herramientas más útiles para ello es Google Analytics. Es importante señalar que la conversión es que el usuario realice una acción, por lo que no tiene que ser una compra, en muchos casos la conversión es que se envíe un formulario.

A diferencia de una compra, donde el usuario tiene que pasar por un proceso de pago, los formularios pudieran ser un poco más complicados de medir, ya que el hecho de que alguien visite una página donde está el formulario, no significa que lo completo y si no quieres contar los correos que te llegan a tu bandeja de entrada, aquí hay una forma de integrar el plugin más famoso para formularios de contacto, Contact Form 7, con Google Analytics.

Una vez que conoces el procedimiento, de manera muy sencilla lo puedes replicar en todos tus formularios de contacto. Puedes incluso crear diferentes objetivos en Google Analytics para rastrear cada formulario por separado.

Paso 1 – Accesa a Google Analytics

Una vez que accesos a tu cuenta de Google Analytics, ve a Administrador y en el la columna de la derecha, el menú Ver, selecciona Objetivos.

Paso 2 – Crea un nuevo objetivo

Elige un nombre para tu objetivo. Por ejemplo, si tu formulario está en la página de contacto, llámalo: “Contáctanos”. Después selecciona la opción “Destino” de los tipos de objetivos.

Paso 3 – Define el destino

Para este proceso elegiremos una URL de destino que no exista. Un buen ejemplo sería: /objetivo/contactanos/

Completa el resto de los parámetros necesarios para finalizar la configuración de tu objetivo.

Código de rastreo de conversión para Contact Form 7 en WordPress (Universal/Clásico)

Ahora, dependiendo de si estás utilizando el Google Analytics Clásico (ga.js) or el nuevo Universal (analytics.js), necesitarás poner una de las siguientes líneas en tus formularios de contacto. Puedes encontrar más información sobre que código de Google Analytics estás usando aquí.

Código de Universal Analytics

on_sent_ok: "ga('send', 'pageview', '/objetivo/contactanos/');"

Código de Classic Analytics

on_sent_ok: "_gaq.push(['_trackPageview', '/objetivo/contactanos/']);"

Nota: Para algunas páginas web estos códigos no funcionan y tienen problemas con la notificación. Si es tu caso, intenta con este código:

on_sent_ok:”_gaq.push(['_trackPageview', '/objetivo/contactanos/', 'sent']);”

Paso 4 – Instala el código en los formularios de Contact Form 7

Ahora ve a tu formulario en Contact Form 7, desplázate hasta abajo de la página a la sección de “Configuraciones adicionales”. En este campo debes de pegar el código de rastreo (universal o clásico) que mostré arriba. Vuelve al inicio de la página y haz click en guardar. ¡Ahora cuando se envíe un formulario de contacto, Google Analytics marcará el objetivo!

Google Analytics de Yoast y Contact Form 7

Si utilizas el plugin de Google Analytics de Yoast y Contact form 7 a veces hay problemas y el envío del formulario no se registra en Google Analytics.

La solución, utiliza este código en vez de los de arriba:

on_sent_ok: "__gaTracker('send', 'pageview', '/goals/contact-form/');"

Fuente: Datify

Actualizado: 4 de Abril de 2016

También puedes medir los envíos de tus formularios como eventos en Google Analytics. Para hacer eso, el archivo de Javascript de Google Analytics nos da esta función:

ga('send', 'event', 'Contact Form', 'submit');

No necesitas modificar ningún archivo de Javascript para utilizar el código anterior debido a que puedes mandarlo a llamar con el hook: on_sent_ok

Contact Form 7 tiene un hook que se ejecuta cuando un formulario se envía correctamente.

Para utilizar el código de analytics usando este hook, lo único que tienes que hacer es abrir la pestaña de Configuraciones Adicionales e insertar lo siguiente en el campo:

on_sent_ok: "ga('send', 'event', 'Contact Form', 'submit');"

No te olvides de pegar correctamente el código y que este en una sola línea.

Eso es todo. Ahora, si configuraste todo correctamente, Google Analytics rastreará los envíos exitosos de tus formularios como eventos con la categoría “Contact Form” y “submit” como la acción.

Para verificar que está funcionando correctamente, puedes ir a Comportamiento > Eventos en Google Analytics 24-48 horas después de la configuración. Si todo está bien, deberás de encontrar tus envíos ahí.

Fuente: Contact Form 7

Jorge Castro

Jorge Castro

Jorge Castro es cofundador de Octopus, una de las agencias líderes de Marketing Digital en Cancún. Tiene experiencia en estrategias integrales de marketing digital. Siempre enfocado a objetivos empresariales, sabe como utilizar las nuevas tecnologías para mejorar y desarrollar los negocios en internet.

Si te gustó el artículo, suscríbete para recibir otros.

Solo recibirás un correo a la semana.

16 Comentarios

  1. Ricardo dice:

    Hola, a mi no me funcionaba de ninguna manera, además de no salir el cartel de mensaje enviado…
    lo he solucionado poniendo el código ga(‘send’, ‘event’, ‘variable a elegir’, ‘a elegir’, ‘a elegir’);, pero se lo he puesto en la pestaña mensajes del contact form despues del mensaje de agradecimiento…. Así me funcionó todo.

    Gracias por tu tuto me fue de gran ayuda…espero que esto sirva a más gente

    • Jorge Castro dice:

      Hola Ricardo!

      Muchas gracias por tu aportación! 🙂 ¿Podrías ser más específico sobre donde pusiste el mensaje? Tal vez tomar una captura de pantalla?

      Saludos, muchas gracias!

      • Ricardo dice:

        Lo que no sé es como subir al comentario la captura de pantalla jeje…
        A ver, una vez que metemos el código en contact Form, en vez de utilizar lapestaña “configuraciones adicionales”, hay una pestaña anterior que se llama “mensajes”. El primer mensaje es el de “El mensaje se ha enviado con éxito.”… Pues bien. ahí ponemos el mensaje que queramos que aparezca y despues el mensaje de script. Quedaría así.

        Su mensaje se ha enviado con éxito. Muchas gracias. –script type=”text/javascript”– ga(‘send’, ‘event’, ‘formulario’, ‘clic’, ‘contacto’); –/script–
        Cambiar los — por según sea apertura y cierre que si no el editror quita las etiquetas…
        Espero que así quede más claro, si no dime como puedo subir una imagen y la pongo

  2. Nicolás dice:

    Hola Jorge, muy interesante el artículo. Estoy intentando trackear la cantidad de formularios que se envían en mi sitio, con el problema de que no tiene Thank you page luego de hacer click en Enviar formulario. En mi caso tengo Universal Analytics implementado a través del Tag Manager, lo cual puedo chequear con el Tag Assistant. Sin embargo analytics.js no aparece en ningún lado de las líneas de código del sitio. ¿A qué se debe esto?
    Muchas gracias!

    • Jorge Castro dice:

      Hola Nicolás,

      En la parte de Configuraciones adicionales de tu Contact Form 7 necesitas agregar un código de javascript que se ejecute después de que se envía el formulario, algo como esto:

      on_sent_ok: "ga('send', 'event', 'Contacto', 'submit');"

      Analytics.js no lo encontrarás en el sitio porque estás utilizando una implementación desde Tag Manager.

      Saludos!

  3. nahuel dice:

    ¡Muy bien tutorial!

    Me preguntaba dónde podría obtener más información sobre el código que se utiliza y sus posibilidades. ¿Tendrás alguna pista?
    Saludos

  4. nahuel dice:

    Hola Jorge, muy explicativo y muy bueno el artículo.

    Estoy tratando de configurar un objetivo en G. Analytics para cuando los usuarios rellenen el formulario de contacto. Quería, además, que aparezca como evento (no sé bien por qué, o si es necesario).

    Por lo tanto traté de configurar el hook para que mande “evento, categoría, label”. Pero en G. Analytics no me aparecen los eventos, ni nada. Ya esperé más de 48 hrs y otros objetivos (tiempo en página, por ejemplo) sí se cumplen.

    Estoy usando el plugin “Simple Google Analytics”; que al parecer utiliza la forma classic de código (intuyo ya que fue la única opción que no hizo que el formulario se congelara).

    Esto es lo que escribí después de mezclar todo lo que había en el post, pero no estoy seguro de si está bien:
    on_sent_ok: “_gaq.push([‘send’, ‘event’, ‘formulario’, ‘submit’, ‘contacto’]);”

    Gracias de antemano por cualquier respuesta y de nuevo, gracias por el post. 😀

  5. nahuel dice:

    Hola, simple y lindo tutorial.
    Utilicé el Hook de la siguiente manera:

    on_sent_ok: “ga(‘send’, ‘event’, ‘formulario’, ‘submit’, ‘contacto’);”

    y creé un objetivo del tipo evento con las mismas características
    – formulario
    – submit
    – contacto
    – (valor vacío)

    Esto hizo que:
    1) El formulario anda, pero no da aviso al usuario del envío exitoso del mensaje.
    2) No aparece ningún evento en G. Analytics.

    ¿Alguna idea de por qué?

    WP Version: 4.7.2
    Contact Form 7: 4.6

    ————————————————-
    Agni Framework : 1.1
    Akismet : 3.2
    Duplicate Post : 3.1.2
    Envato WordPress Toolkit : 1.7.3
    Hello Dolly : 1.6
    Loco Translate : 2.0.11
    MailChimp for WordPress : 4.0.12
    Simple Google Analytics : 2.2.2
    Slider Revolution : 5.3.0.2
    WPBakery Visual Composer : 5.0

  6. Sol dice:

    GRACIAS JORGE. He utilizado este código: __gaTracker y por fin he conseguido crear el evento y el objetivo en analytics. Saludos.

Deja un comentario

You have to agree to the comment policy.