Cómo integrar con OpenCart

Objetivos del artículo

Aprende a integrar OpenCart con Klaviyo. Después de completar estos pasos, podrás personalizar y dirigir los correos electrónicos en función de la compra y la actividad en el sitio web de cada cliente. La integración de OpenCart se sincroniza cada hora.

Antes de empezar

Ten en cuenta que Klaviyo no sincroniza el catálogo desde OpenCart.

Agregar la integración de OpenCart

El proceso para agregar la integración de OpenCart de Klaviyo consta de varios pasos y requiere realizar acciones tanto en OpenCart como en Klaviyo.

Para empezar, actualmente Klaviyo es compatible con OpenCart 1.4.x y 1.5.x. Descarga el módulo de Klaviyo para OpenCart desde aquí: https://www.klaviyo.com/media/downloads/OpenCartKlaviyo-1.1.0.tgz.

1. Descomprime el archivo en la raíz de la instalación de OpenCart.
2. Inicia sesión en la sección de administración de OpenCart y ve a la página Extensiones > Módulos.
3. Instala el módulo de Klaviyo y luego haz clic en Editar para el módulo de Klaviyo.
4. Lo último que debes hacer con la instalación de OpenCart es copiar y pegar el siguiente código PHP al final de `upload/index.php`, justo antes de la línea `$response->getOutput();`:

// [Klaviyo] Save customer cart if it exists.
if ($registry->get('cart')->hasProducts()) {
  $registry->get('load')->model('module/klaviyo');

  if ($registry->get('customer')->isLogged()) {
    $registry->get('model_module_klaviyo')->saveCustomerCart(
      session_id(),
      $registry->get('customer')->getId(),
      $session->data['cart']
    );
  } else if (array_key_exists('guest', $session->data)) {
    $registry->get('model_module_klaviyo')->saveGuestCart(
      session_id(),
      $session->data['guest'],
      $session->data['cart']
    );
  }
}

1. En Klaviyo, selecciona la pestaña Integraciones.
2. Haz clic en Explorar aplicaciones y busca OpenCart; luego, haz clic en la tarjeta. Entonces haz clic en Instalar.
3. Se te llevará a una página de Integration Settings . En la página de configuración, ingresa la URL del sitio de OpenCart y haz clic en Conectar con OpenCart.
   

4. En la siguiente página, copia la clave de API en Klaviyo OpenCart Module y pégala en la configuración del módulo de Klaviyo en OpenCart. Guarda la configuración del módulo de Klaviyo en el administrador de OpenCart.
   

5. Si quieres, activa la configuración Agregar nuevos clientes de OpenCart a una lista de Klaviyo y selecciona una lista en el menú desplegable.
6. De vuelta en Klaviyo, haz clic en Completar configuración para empezar a sincronizar datos.

Instalar el seguimiento en el sitio de Klaviyo

Para hacer seguimiento de la actividad en el sitio en OpenCart, primero encuentra tu clave de API pública de Klaviyo: inicia sesión en tu cuenta, haz clic en el nombre de tu cuenta en la esquina inferior izquierda y ve a Configuración > Claves de API. Tu clave pública tiene seis caracteres. Hay dos tipos de seguimiento en el sitio que puedes instalar:

• Con actividad en el sitio
  Esta métrica se registra cada vez que un navegador identificable visita tu sitio web
• Producto visto
  Esta métrica se registra cada vez que un navegador identificable ve una página de producto en tu sitio web

Agrega el seguimiento de "Con actividad en el sitio"

Esta métrica se registra cada vez que un navegador identificable visita tu sitio web. Para comenzar a hacer el seguimiento de la actividad de Con actividad en el sitio:

1. Agrega el siguiente fragmento de código a la plantilla principal de tu tienda para que se incluya en todas las páginas. Debes colocar este fragmento de código junto con otros scripts de analítica que uses o justo antes de la etiqueta de cierre </body>:
   

<script type="text/javascript" async="" src="https://static.klaviyo.com/onsite/js/PUBLIC_API_KEY/klaviyo.js></script>
<script type="text/javascript"> 
//Initialize Klaviyo object on page load
!function(){if(!window.klaviyo){window._klOnsite=window._klOnsite||[];try{window.klaviyo=new Proxy({},{get:function(n,i){return"push"===i?function(){var n;(n=window._klOnsite).push.apply(n,arguments)}:function(){for(var n=arguments.length,o=new Array(n),w=0;w<n;w++)o[w]=arguments[w];var t="function"==typeof o[o.length-1]?o.pop():void 0,e=new Promise((function(n){window._klOnsite.push([i].concat(o,[function(i){t&&t(i),n(i)}]))}));return e}}})}catch(n){window.klaviyo=window.klaviyo||[],window.klaviyo.push=function(){var n;(n=window._klOnsite).push.apply(n,arguments)}}}}(); </script>

1. Asegúrate de reemplazar PUBLIC_API_KEY con la clave de API pública de tu cuenta de Klaviyo.
2. Si los visitantes o clientes pueden crear cuentas para tu tienda, agrega el siguiente fragmento de código directamente debajo del primer fragmento de código:

<script type="text/javascript">
  var klaviyo = window.klaviyo || [];
  {% if user.is_logged_in %}
  klaviyo.identify({
    $email: '{{ user.email }}',
    $first_name: '{{ user.first_name }}',
    $last_name: '{{ user.last_name }}'
    });
  {% endif %}
</script>

1. Según los tipos de plantillas que uses para tu sitio web, es probable que la sintaxis de {% if user.is_logged_in %} y {{ user.email }} sea diferente. Con el lenguaje de plantillas disponible, debes comprobar si la persona que está viendo la página actual ha iniciado sesión. Si es así, debes mostrar su correo electrónico y su nombre, si está disponible. Si no tienes información del nombre, elimina esas dos líneas y la coma final después de la línea de correo electrónico $email.

Agregar el seguimiento de "Viewed Product"

Si quieres configurar un flujo de abandono de la navegación o crear segmentos basados en datos de navegación de productos, debes añadir seguimiento de eventos de JavaScript para una métrica de "Viewed Product".

1. En la plantilla de la página de producto, agrega el siguiente fragmento:

<script type="text/javascript">
    var klaviyo = window.klaviyo || [];
    klaviyo.track("Viewed Product", {
      Title: '{{ product.title }}',
      ItemId: {{ product.id }},
      Categories: {{ category in product.categories|json }}, // The list of categories is an array of strings. 
      ImageUrl: '{{ product.image_url }}',
      Url: '{{ product.url }}',
      Metadata: {
        Brand: '{{ product.brand }}',
        Price: {{ product.price }},
        CompareAtPrice: {{ product.compare_at_price }} // If you have a compare at price. You could also include this for a sale or special price.
      }
  });
</script>

1. El fragmento de código anterior usa la sintaxis del marcador de posición {{ }}, que puede ser diferente para tu tienda de OpenCart. La parte importante es que los campos de producto se renderizan dinámicamente en función de la página de producto que estés viendo.
2. Después de configurar el seguimiento de Viewed Product para el sitio, los datos de Viewed Product deberían empezar a completarse en la cuenta de Klaviyo a medida que los visitantes conocidos naveguen por las páginas de productos.

Cómo funciona el seguimiento en el sitio

Cuando agregas el seguimiento web de Klaviyo a tu sitio, solo podemos rastrear la actividad de navegación de los "navegadores conocidos" (es decir, navegadores que han visitado y con interacciones al menos una vez antes). Hay dos formas clave en las que podemos identificar a un visitante del sitio para fines de seguimiento web:

• Si en algún momento alguien hizo clic en un Klaviyo Email que lleva a tu sitio web
• Si en algún momento alguien se suscribió o se registró mediante un formulario de Klaviyo

Klaviyo no hará seguimiento de navegadores anónimos.

Monitorea la sincronización de Klaviyo

El tiempo que tomará sincronizar todos los datos históricos de clientes y pedidos desde la tienda de OpenCart depende del tamaño de la tienda. Una vez que se complete esta sincronización histórica, verás un borde verde alrededor de la integración de OpenCart en Enabled Integrations.

Para comprobar la integración:

1. Ve a la pestaña Métricas de la cuenta, que se encuentra en Analytics. Aquí puedes filtrar para ver todas las métricas de OpenCart. Encuentra la métrica Placed Order de OpenCart y haz clic en el ícono de Feed de actividad. Si las integraciones ya comenzaron a sincronizar datos, empezarás a ver que los eventos Placed Order aparecen aquí.
2. Sincronizaremos automáticamente todos los datos históricos de pedidos. Para verificarlo, puedes comparar la cantidad de eventos de un día en particular en Klaviyo con lo que aparece en tu interfaz de OpenCart y confirmar que coincidan.
3. Por ejemplo, al explorar la métrica Pedido Realizado, puedes pasar el cursor sobre el punto de datos de ayer o revisar la tabla de datos debajo de la gráfica para ver cuántos pedidos se reportaron ayer.
4. Compara ese número con lo que está almacenado en OpenCart desde ayer y deberías ver que coinciden exactamente. Si no coinciden, lo más probable es que la zona horaria de la cuenta de Klaviyo no coincida con la zona horaria configurada en OpenCart.
5. Para comprobar o actualizar la zona horaria de tu cuenta:
   • Haz clic en el nombre de tu organización en la parte inferior izquierda.
   • Selecciona Configuración.
   • Ve a la pestaña Organización .

Datos sincronizados desde OpenCart

• Datos de ventas y pedidos
  Qué productos se compraron, incluidos los detalles del producto y las imágenes.
• Información del cliente
  Nombre, apellidos, ubicación y grupo de clientes.
• Datos de inicio de pago
  Se utiliza para activar correos electrónicos de carrito abandonado. Esto se habilita mediante el fragmento de código PHP que agregaste al integrar.
• Datos de pedido completado
  Se usa para realizar un seguimiento de cuándo se envían los pedidos.
• Seguimiento en el sitio
  Cuando las personas visitan el sitio web

Para ver las métricas de OpenCart, ve a Analytics > Metrics en Klaviyo, donde puedes filtrar por OpenCart.

De forma predeterminada, Klaviyo sincroniza los siguientes estados para las métricas Pedido realizado y Pedido completado:

• Placed Order: Pendiente, Procesado, En proceso, Enviado, Completo
• Pedido completado: Enviado, Completo

Recursos adicionales