Tabla de contenidos
Cuando un producto se agota, muchos merchants pierden ventas potenciales. Sin embargo, implementar una funcionalidad de back in stock (avisos de reposición) permite notificar a los clientes interesados tan pronto como el artículo vuelva a estar disponible. En este artículo te mostraremos cómo configurar back in stock de Shopify con Klaviyo paso a paso, abarcando desde la automatización en Klaviyo hasta la integración del snippet en tu tienda Shopify, incluyendo estilos personalizados y el cumplimiento de la normativa GDPR.
1. Introducción y Problemática que Resuelve
Los clientes que se topan con un producto agotado suelen abandonar la compra, lo que significa una pérdida directa en ventas para tu negocio. Aquí es donde la función de back in stock se vuelve esencial. Al permitir que los clientes se suscriban para recibir una notificación cuando el producto vuelva a estar disponible, se recuperan ventas potenciales y se incrementa la fidelidad de la marca.
El uso de Klaviyo, una potente herramienta de marketing automation, simplifica la creación de este flujo. La integración entre Shopify y Klaviyo para notificar a los clientes es muy valorada por merchants en España y América Latina, ya que ayuda a mantener una comunicación directa y automatizada en el momento justo.
2. Cómo Configurar la Automatización en Klaviyo
El primer paso es configurar el flow por defecto de back in stock en Klaviyo. Este flow se encarga de enviar automáticamente el correo o notificación cuando el producto regrese a stock. Para hacerlo, sigue estos pasos:
Accede a tu cuenta de Klaviyo: Ingresa a la sección de Signup Forms o Flows.
Selecciona o crea el flow Back in Stock: Klaviyo ofrece una plantilla predeterminada para esta funcionalidad. Consulta la KB de Klaviyo para detalles específicos.
Personaliza el contenido: Define el asunto, la imagen y el mensaje que se enviará a los clientes. Asegúrate de incluir un mensaje claro sobre la disponibilidad del producto y un llamado a la acción que invite a realizar la compra.
Esta automatización es esencial para convertir la intención de compra en acción, recuperando clientes que han mostrado interés en productos que estaban agotados.
2. Cómo Configurar el Snippet en Shopify
Una vez configurado el flow en Klaviyo, el siguiente paso es integrar el snippet que mostrará el botón de “AVÍSAME CUANDO ESTÉ DISPONIBLE” en las páginas de producto de Shopify. Asegúrate de colocar este código en el lugar adecuado de tu plantilla, de modo que se active cuando un producto esté agotado.
Antes de utilizar el script, debes recuperar las variables:
2.1 [YOUR_ACCOUNT_ID]
Tu your_account_id también se conoce como Public API Key en Klaviyo. Para encontrarlo:
- Inicia sesión en Klaviyo.
- Haz clic en el menú superior derecho (tu nombre o cuenta) y selecciona Account.
- Ve a la pestaña Settings > API Keys.
- Tu clave pública aparecerá como Public API Key — eso es tu
your_account_id.
2.2. [YOUR_LIST_ID]
Tu your_account_id también se conoce como Public API Key en Klaviyo. Para encontrarlo:
- Inicia sesión en Klaviyo.
- Haz clic en el menú superior derecho (tu nombre o cuenta) y selecciona Account.
- Ve a la pestaña Settings > API Keys.
- Tu clave pública aparecerá como Public API Key — eso es tu
your_account_id.
Utiliza el siguiente script definitivo, reemplazando [YOUR_ACCOUNT_ID] y [YOUR_LIST_ID] por tus datos reales:
<script>
var klaviyo = klaviyo || [];
klaviyo.init({
account: "[YOUR_ACCOUNT_ID]",
list: "[YOUR_LIST_ID]",
platform: "shopify"
});
klaviyo.enable("backinstock", {
trigger: {
product_page_text: "AVÍSAME CUANDO ESTÉ DISPONIBLE",
product_page_class: "button klaviyo-bis-trigger",
product_page_text_align: "center",
product_page_margin: "0px",
replace_anchor: false
},
modal: {
headline: "{product_name}",
body_content: "Regístrate para recibir una notificación cuando volvamos a tener stock.",
email_field_label: "Email",
button_label: "AVÍSAME CUANDO ESTÉ DISPONIBLE",
subscription_success_label: "Estás dentro! En cuanto tengamos stock lo sabrás.",
footer_content: '',
additional_styles: "@import url('https://fonts.googleapis.com/css?family=Helvetica+Neue');",
drop_background_color: "#000",
background_color: "#fff",
text_color: "#222",
button_text_color: "#fff",
button_background_color: "#ca6c38",
close_button_color: "#ccc",
error_background_color: "#fcd6d7",
error_text_color: "#C72E2F",
success_background_color: "#d3efcd",
success_text_color: "#1B9500",
newsletter_subscribe_label: "Quiero suscribirme a la newsletter y acepto la Política de privacidad. *",
privacy_policy_label: "Quiero suscribirme a la newsletter y acepto la Política de privacidad. *",
subscribe_checked: false
}
}); </script>
3. Personalización de Estilos y Cumplimiento con GDPR
Para asegurarte de que el botón se muestre correctamente y cumpla con los estándares de diseño, es importante añadir estilos CSS personalizados. Además, dado que el snippet incluye la opción de la casilla de aceptación para la política de privacidad (clave en el cumplimiento del GDPR), es necesario que el diseño sea claro y accesible. Agrega el siguiente bloque de estilos en tu plantilla (por ejemplo, en theme.css o theme.scss.liquid):
.klaviyo - bis - trigger {
display: block;
margin - top: 0.5 rem; /* Espaciado superior */
width: 100 % !important;
background - color: #ca6c38;
padding: 10 px;
margin: 5 px!important;
border - radius: 2 px;
color: #fff!important;
}
.klaviyo - bis - trigger: hover {
background - color: rgb(163, 86, 44);
color: #fff;
}
4. Consideraciones de GDPR
Checkbox de privacidad: La etiqueta newsletter_subscribe_label (y la similar privacy_policy_label) incluye un enlace a la política de privacidad. Esto es crucial para asegurar que los usuarios confirmen su consentimiento al suscribirse.
Enlace de la política: Si deseas abrir la política de privacidad en una nueva pestaña, puedes modificar el enlace en la etiqueta, agregando target=»_blank» y rel=»noopener noreferrer». Esto mejora la experiencia del usuario y es una buena práctica de seguridad.
Por ejemplo, podrías ajustar la etiqueta a:
newsletter_subscribe_label: "Quiero suscribirme a la newsletter y acepto la <a style="
color: #333;" href="https://nordicpandas.com/pages/politica-de-privacidad" target="_blank" rel="noopener noreferrer"> Política de privacidad < /a>. *",
Esta personalización garantiza que tu integración cumpla con la normativa GDPR y ofrezca una experiencia clara y transparente a tus clientes. <
5. Conclusión
Implementar Klaviyo back in stock Shopify es una estrategia efectiva para recuperar ventas y mantener el interés del cliente cuando un producto se agota. Con esta guía:
Comprendiste la problemática y la importancia de avisar a los clientes sobre la reposición de stock.
Configuraste la automatización en Klaviyo mediante su flow predeterminado.
Integraste el snippet en Shopify para mostrar el botón de “AVÍSAME CUANDO ESTÉ DISPONIBLE”.
Personalizaste el diseño con CSS y añadiste la casilla de aceptación de la política de privacidad para cumplir con GDPR.
Siguiendo estos pasos, podrás mejorar la experiencia de tus clientes y aumentar las conversiones en tu tienda. ¡Pon en práctica estos consejos y no dejes que un producto agotado se convierta en una venta perdida!
