Instalación y control de Zopim con Google Tag Manager

¿Quieres ver el contenido de la página? Mostrar

En un mundo digital en constante evolución, la interacción con los clientes se ha convertido en un factor crucial para el éxito de cualquier negocio. Las experiencias en línea pueden ser frustrantes, especialmente cuando los usuarios no encuentran la ayuda que necesitan. Los chat en vivo, como Zopim (ahora Zendesk Chat), ofrecen una solución eficaz, permitiendo a los visitantes conectarse instantáneamente con el servicio al cliente. En este artículo, exploraremos cómo instalar este widget utilizando Google Tag Manager, controlar su funcionamiento y rastrear eventos relevantes en Google Analytics.

Si eres dueño de un sitio web o trabajas en marketing digital, entender cómo optimizar la interacción con tus usuarios es fundamental. No solo se trata de proporcionar respuestas rápidas, sino también de analizar el comportamiento de tus visitantes para mejorar la experiencia del usuario. Vamos a desglosar cómo lograr esto con Zopim y Google Tag Manager.

Instalación de Zopim utilizando Google Tag Manager

Google Tag Manager (GTM) es una herramienta que facilita la gestión de etiquetas de seguimiento y códigos en tu sitio web sin necesidad de modificar directamente el código. Para instalar Zopim, deberás seguir unos pasos simples que te permitirán integrar el widget de chat en tu página.

Una vez que hayas creado tu cuenta en Zopim, recibirás un fragmento de código JavaScript. Este código es esencial para que el widget funcione correctamente. Aunque se recomienda incluirlo en la sección <head> de tu HTML, también es posible colocarlo en la sección <body>. A continuación, se detallan los pasos para añadir el código a través de Google Tag Manager:

Accede a tu cuenta de Google Tag Manager.
Haz clic en la opción Tags y selecciona Nuevo.
Elige Custom HTML como tipo de etiqueta y pega el código de Zopim.
Configura la etiqueta para que se active en All pages.
Guarda los cambios y utiliza el modo de Preview para verificar que el widget de chat aparezca en tu sitio.

Con estos pasos, tu chat en vivo estará disponible para los visitantes, facilitando así la comunicación con tu equipo de soporte.

Control del widget de chat Zopim mediante Google Tag Manager

Ahora que has instalado Zopim, es hora de explorar cómo puedes controlar su comportamiento usando Google Tag Manager. Dependiendo de tu plan de Zopim, tendrás acceso a diversas funcionalidades, como la posibilidad de personalizar el chat mediante su API de JavaScript.

Una de las características más útiles es la capacidad de manipular el Chat Badge. A través de la API, puedes realizar acciones como mostrar, ocultar o cambiar el color del ícono del chat. Aquí hay una breve guía sobre cómo expandir el badge del chat:

Selecciona el método $zopim.livechat.badge para acceder a las funciones disponibles.
Elige la acción que desees realizar, como show para mostrar el badge.

Por ejemplo, si deseas que el chat se expanda cuando un usuario necesite ayuda, puedes utilizar el siguiente código:

<script>
 $zopim(function() {
 $zopim.livechat.badge.show();
 });
</script>

Recuerda que el momento adecuado para expandir el chat es crucial. Considera activar el badge cuando el usuario esté en páginas específicas o después de un tiempo en la misma página. Algunas sugerencias incluyen:

Cuando el usuario visita la página de Contacto.
Después de que haya pasado un tiempo determinado, como 90 segundos, en la página.

Personalización del mensaje del badge de chat

Además de mostrar el badge, puedes personalizar el mensaje que aparece en él. Por defecto, dice «Estamos en línea», pero puedes cambiarlo a algo más atractivo como «¿Quieres hablar?». Para hacerlo, añade la siguiente línea de código:

 $zopim.livechat.badge.setText('¿Quieres hablar?');

El código completo quedaría así:

<script>
 $zopim(function() {
 $zopim.livechat.badge.show();
 $zopim.livechat.badge.setText('¿Quieres hablar?');
 });
</script>

Este simple ajuste puede incrementar la tasa de interacción de los usuarios con el chat.

Evitar la expansión prematura del badge

Es fundamental encontrar un equilibrio en la presentación del chat. Mostrar el badge demasiado pronto puede resultar molesto para los visitantes. Considera los siguientes momentos para activar el chat:

Visita a la página de Contacto.
Después de 90 segundos en una página.

Recuerda que la clave está en la experimentación. Pregunta a tus usuarios sobre su experiencia y ajusta el tiempo de aparición del chat según sus comentarios.

Tracking de Zopim con Google Tag Manager

Una de las ventajas de integrar Zopim con Google Tag Manager es la capacidad de rastrear interacciones clave. Por ejemplo, es útil saber cuándo inicia y finaliza una conversación en el chat. Para ello, se puede utilizar un Listener de eventos que te permitirá enviar esta información a Google Analytics.

Listener personalizado de Zopim para GTM

He desarrollado un pequeño código que escucha las interacciones del chat, específicamente cuándo comienza y termina. Este código se puede añadir en Google Tag Manager como una etiqueta HTML personalizada:

<script>
  $zopim(function() {
      $zopim.livechat.setOnChatStart(function() {
        // Acción cuando inicia el chat
        window.dataLayer.push({
          "event": "zopimChat",
          "zopimChatAction": "zopimChatStarted"
        });
    });
    $zopim.livechat.setOnChatEnd(function() {
        // Acción cuando se cierra el chat
        window.dataLayer.push({
          "event": "zopimChat",
          "zopimChatAction": "zopimChatClosed"
        });
    });
  });
</script>

Una vez que el chat comience o termine, este listener activa el evento zopimChat con el atributo zopimChatAction, que puede tener los valores zopimChatStarted o zopimChatClosed.

Para habilitar este listener, crea una nueva etiqueta en Google Tag Manager y configura el disparador para que se active en Pageview y DOM Ready.

Creación de variables y disparadores en GTM

Después de crear la etiqueta del listener, es esencial establecer disparadores y variables que permitan capturar los eventos de zopimChat y sus acciones correspondientes. Aquí tienes cómo hacerlo:

Crea un disparador con la configuración adecuada.
Establece una variable para capturar el valor de zopimChatAction.

Una vez que tu variable esté activa, verifica que funcione correctamente en el modo de vista previa de Google Tag Manager. Inicia o finaliza una conversación en el chat y asegúrate de que se registre el evento correspondiente en el panel de depuración.

Registro de eventos en Google Analytics

Finalmente, es momento de enviar estos datos a Google Analytics. Crea una nueva etiqueta en Google Tag Manager de tipo Universal Analytics y configúrala para que se active con el evento zopimChat. Asegúrate de que los siguientes parámetros estén configurados:

Categoría de evento: Zopim Chat
Acción de evento: ya sea zopimChatStarted o zopimChatClosed.

Una vez que esta etiqueta esté activa, realiza pruebas en Google Analytics para asegurarte de que se registren las interacciones de los usuarios en tiempo real.

Conclusiones sobre la integración de Zopim y Google Tag Manager

La combinación de Zopim y Google Tag Manager es una estrategia poderosa para mejorar la interacción con los visitantes de tu sitio web. No solo permite una comunicación efectiva entre los usuarios y el soporte, sino que también brinda datos valiosos sobre el comportamiento del cliente. Al seguir los pasos descritos, podrás optimizar la experiencia del usuario, asegurando que cada conversación se traduzca en una oportunidad para tu negocio.

Al implementar estas técnicas, estarás mejor equipado para satisfacer las necesidades de tus clientes, transformando la frustración en satisfacción y fidelización. Recuerda que la clave está en la experimentación y en adaptar tu enfoque basado en las respuestas de tus usuarios. ¡El éxito está a solo un chat de distancia!