Cómo instalar manualmente Klaviyo.js para Shopify tienda, comercio

Objetivos de aprendizaje

Aprende a instalar manualmente Klaviyo's con actividad on Site seguimiento snippet, también conocido como Klaviyo's onsite JavaScript o Klaviyo.js, en tu Shopify tienda, comercio. Sólo deberías hacer esto si experimentas un tráfico web muy elevado o tu sitio sufre un tiempo de carga lento por cualquier otro motivo (aunque Klaviyo ha mejorado recientemente los tiempos de carga en, por lo que puede que no sea la causa). Si no, te recomendamos que instales Klaviyo.js en habilitando la incrustación de la app Shopify de Klaviyo.

Antes de empezar

Si decides instalar manualmente Klaviyo.js y anteriormente lo tenías habilitado a través de Klaviyo's app embed, primero debes desactivar/inhabilitar la app embed en la configuración de tu tema Shopify.

Instala Klaviyo.js en tu Shopify tienda, comercio

1. Copia el siguiente fragmento de código:

<script type="text/javascript" async="" src="https://static.klaviyo.com/onsite/js/PUBLIC_API_KEY/klaviyo.js"></script>

1. En el fragmento de código, asegúrate de sustituir PUBLIC_API_KEY por tu clave de API pública de Klaviyo de seis dígitos.
2. Si has habilitado cliente cuenta para tu tienda, comercio, añade un script extra para identificar a tu cliente con el correo electrónico que utiliza para iniciar sesión en tu tienda, comercio. El conjunto completo de guiones tendrá el siguiente aspecto:

<script type="text/javascript" async="" src="https://static.klaviyo.com/onsite/js/PUBLIC_API_KEY/klaviyo.js"></script>
<script type="text/javascript"> 
 //Inicializar el objeto Klaviyo al cargar la página
!function(){if(!window.Klaviyo){window._klOnsite=window._klOnsite||[];try{window.Klaviyo=new Proxy({},{get:function(n,i){return"notificación 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]=argumentos[w];var t="function"==typeof o[o.length-1]?o.pop():void 0,e=new Promise((function(n){window._klOnsite.notificación push([i].concat(o,[function(i){t&&t(i),n(i)}]))}});return e}}})}catch(n){window.Klaviyo=window.Klaviyo[],window.Klaviyo.notificación push=function(){var n;(n=window._klOnsite).notificación push.apply(n,arguments)}}}}(); </script>
< script type="text/javascript"> 
 //cliente cuenta
var Klaviyo = window.Klaviyo || [];
if ("{{ customer.email }}" ) {Klaviyo.identify({"$email" : "{{ customer.email }}"})};
</script>

1. Desde tu Shopify Administrador haz clic en tienda en línea > Temas. En el desplegable, haz clic en Editar código.
   

2. Busca los archivos a los que quieras añadir el fragmento y haz clic para abrirlo en el editor. Puedes añadir el fragmento a cualquier plantilla de página en la que quieras habilitar los formularios y el seguimiento de Klaviyo en las páginas correspondientes.
3. Desplázate hasta la parte inferior del archivo y pega tu fragmento debajo del otro código.
   

4. Haz clic en Guardar.

Prueba tu con actividad en Sitio seguimiento

Para comprobar que tu con actividad en el Sitio seguimiento está configurado correctamente, sigue estos pasos:

1. Navega a tu sitio web.
2. En tu página de inicio, añade lo siguiente al final de la URL, sustituyendo example@gmail.com con tu dirección de correo electrónico:
   ?utm_email=example@gmail.com
   
   

3. Vuelve a cargar la página.
4. Busca en Klaviyo tu dirección de correo electrónico.
   

Deberías ver que se ha creado un perfil Klaviyo para ti (si no existía ya uno) y que se ha realizado un seguimiento de esta actividad en tu feed de actividad.

Ahora que ya has instalado Klaviyo.js, podrás utilizar con actividad el seguimiento del Sitio, Klaviyo formulario de registro, y mucho más.

Recursos adicionales