Cómo integrar Magento (Adobe Commerce) con Klaviyo: extensión, eventos y flujos
Conecta Magento 2 / Adobe Commerce con Klaviyo: extensión oficial, sync de pedidos y catálogo, eventos GraphQL, flujos esenciales y verificación de DKIM y DMARC.
Magento (Adobe Commerce) potencia muchas tiendas medianas y grandes en España y, a diferencia de Shopify o WooCommerce, exige un nivel técnico considerable para integrar bien cualquier ESP. La extensión oficial de Klaviyo cubre lo básico, pero exprimir la integración suele requerir tocar local.xml, observers, GraphQL y entender cómo viajan los datos entre el frontend (PWA Studio o Luma) y Klaviyo. Esta guía recorre la instalación estándar y las extensiones típicas para tiendas reales.
Para qué sirve la integración Magento ↔ Klaviyo
La conexión, bien hecha, ofrece:
- Sync histórico de clientes, pedidos y productos desde el catálogo de Magento.
- Tracking onsite mediante el snippet de Klaviyo cargado en el theme.
- Eventos en tiempo casi real: vistas, adiciones al carrito, checkouts iniciados, pedidos.
- Catálogo dinámico para usar imágenes, precios y URLs en bloques de email.
En el flujo B2B, la integración también puede sincronizar empresas y reglas de precio, aunque suele requerir desarrollo adicional.
Requisitos previos
- Magento Open Source 2.4.4+ o Adobe Commerce 2.4.4+.
- PHP 8.1 / 8.2 según la versión.
- Composer con acceso al repositorio de Klaviyo.
- Acceso SSH al servidor para
bin/magento setup:upgradeycache:flush. - Cuenta de Klaviyo con Public API Key y Private API Key con scope
events:write,profiles:read-write,catalogs:read-write. - Subdominio de envío con configurar SPF y firma DKIM ya publicados.
Instalación de la extensión oficial
Klaviyo distribuye su extensión vía Composer:
composer require klaviyo/magento2-extension
bin/magento setup:upgrade
bin/magento setup:di:compile
bin/magento setup:static-content:deploy -f
bin/magento cache:flushTras desplegar:
- Backoffice → Stores → Configuration → Klaviyo.
- Public API Key (site ID).
- Private API Key.
- Selecciona la lista por defecto.
- Activa “Real time event sync” y “Web tracking”.
- Guarda y vacía caché.
La extensión inyecta automáticamente el snippet klaviyo.js en el frontend (Luma). Para PWA Studio, hay que añadirlo manualmente al index.html o al componente raíz.
Verificación de inyección
Inspecciona el frontend con DevTools y filtra klaviyo en Network. Deberías ver:
GET https://static.klaviyo.com/onsite/js/XxYyZz/klaviyo.jsSi no aparece, revisa que MAGE_MODE no sea default (en producción) y que el caché está limpio.
Configuración mínima recomendada
Listas y consent
Crea como mínimo:
Newsletter Magentocon doble opt-in.Customers Magento(sync, no marketing por defecto).
En Magento, ve a Stores → Configuration → Customers → Newsletter y mantén el opt-in en “Need to confirm”. Esto asegura registro de consent legible.
Mapeo de atributos
La extensión mapea por defecto:
| Klaviyo | Magento |
|---|---|
$email | customer.email |
$first_name | customer.firstname |
$last_name | customer.lastname |
$phone_number | address.telephone (E.164) |
$organization | company (B2B) |
language | store_view.locale |
Para atributos personalizados (pricing tier, tax class), añádelos como propiedades extra mediante un observer:
namespace Vendor\KlaviyoExtras\Observer;
use Magento\Framework\Event\ObserverInterface;
class CustomerSync implements ObserverInterface {
public function execute(\Magento\Framework\Event\Observer $observer) {
$customer = $observer->getCustomer();
// Empuja propiedad personalizada
$properties = [
'$email' => $customer->getEmail(),
'pricing_tier' => $customer->getCustomAttribute('pricing_tier')
? $customer->getCustomAttribute('pricing_tier')->getValue()
: 'retail',
];
// ... llamada a la API de Klaviyo
}
}Eventos típicos a sincronizar
La extensión cubre out-of-the-box:
| Evento Klaviyo | Origen Magento |
|---|---|
Active on Site | snippet onsite |
Viewed Product | catalog_controller_product_view |
Added to Cart | checkout_cart_product_add_after |
Started Checkout | observer al asignar email al quote |
Placed Order | sales_order_place_after |
Ordered Product | iteración de items del pedido |
Cancelled Order | sales_order_state_change_before con state Canceled |
Refunded Order | sales_order_creditmemo_save_after |
Subscribed to Newsletter | newsletter_subscriber_save_after |
Para PWA Studio o Hyvä, el web pixel necesita inyectarse manualmente y los eventos onsite (Viewed Product, Added to Cart) deben dispararse desde el JS de la SPA, no del backend.
Flujos esenciales que activar
Empieza por:
- Welcome Series. 3 emails tras suscripción a
Newsletter Magento. - Abandoned Cart.
Started CheckoutsinPlaced Orderen 1-2h. 3 emails. - Browse Abandonment.
Viewed Productrepetido sin add to cart. - Post-purchase.
Placed Order. Confirmación, instrucciones, review request, cross-sell. - Winback. Sin compra en 90 / 180 días.
En B2B, añade un flow de renovación disparado por Date of Last Order y filtrado por pricing_tier=wholesale.
Bloque dinámico de productos
{% for item in event.extra.line_items %}
<table>
<tr>
<td><img src="{{ item.product.images.0 }}" width="120"></td>
<td>
<a href="{{ item.product.url }}">{{ item.product.title }}</a><br>
{{ item.line_price | money_format }}
</td>
</tr>
</table>
{% endfor %}Si el catálogo de Magento usa atributos custom (brand, material), expónlos como propiedades del producto en Klaviyo a través del feed.
Errores comunes y soluciones
”Eventos llegan duplicados”
Causa típica: tienes la extensión + un módulo de terceros (algunos packs SEO) que también dispara eventos. Audita en bin/magento module:status y deshabilita el redundante.
”Web pixel no carga en Hyvä o PWA Studio”
La extensión oficial está pensada para Luma. En Hyvä, instala la versión compatible o añade el snippet manualmente en app/design/frontend/Vendor/theme/Magento_Theme/templates/html/header.phtml. En PWA Studio, usa el componente <Head> de Apollo:
<Helmet>
<script async src="https://static.klaviyo.com/onsite/js/PUBLIC_KEY/klaviyo.js" />
</Helmet>“Imágenes en cache antigua”
Magento sirve imágenes vía pub/media/catalog/product/cache/.... Si has cambiado tamaños de imagen, las URLs cambian y Klaviyo cachea las antiguas. Solución: Klaviyo → Catalogs → Sync now.
”Sync inicial tarda horas”
Tiendas con > 100k pedidos pueden tardar mucho. Aumenta el límite de memoria PHP (memory_limit=2G) y ejecuta el sync en CLI:
bin/magento klaviyo:sync:orders --since=2024-01-01“Customer match en B2B con múltiples emails por cuenta”
En B2B, una cuenta empresa tiene varios usuarios con emails distintos. Klaviyo une por email; si quieres tratar la empresa como entidad, mapea $organization y crea segmentos por empresa, no por usuario individual.
Verificación: ¿la integración funciona?
- Pedido de prueba. Compra con tu email. Klaviyo → Profiles debe mostrar
Started Checkout,Placed Order,Ordered Product. - Catálogo. Klaviyo → Catalogs → Products coincide con el número de productos visibles en Magento (no incluyendo deshabilitados).
- Email real. Campaña a un segmento que solo te incluya. Cabeceras esperadas:
Authentication-Results: mx.google.com;
dkim=pass [email protected] header.s=klaviyo
spf=pass smtp.mailfrom=bounce.tutienda.com
dmarc=pass header.from=tutienda.comSi SPF da softfail, revisa que el subdominio en Klaviyo está verificado y que CNAMEs/TXT están bien.
Implicaciones de entregabilidad
Magento 2 tiene su propio sistema de mails transaccionales (orden, password reset, factura), que normalmente sale por SMTP configurado en Stores → Configuration → Sales Emails. Klaviyo se ocupa solo del marketing por defecto. Recomendaciones:
- Subdominio dedicado para marketing (
news.tutienda.com) y otro para transaccional (mail.tutienda.com). Aísla la reputación. - El SMTP transaccional de Magento puede ser SendGrid, Postmark o Amazon SES. Configura SPF y DKIM también para esos emisores.
- Política DMARC en
p=nonedurante 2-4 semanas, luegoquarantine. Comprueba que reportes RUA muestran ambos remitentes pasando. - Activa List-Unsubscribe one-click. Klaviyo lo añade por defecto.
- Si la base es grande pero lleva mucho sin envíos, warming gradual antes de campañas masivas.
- Monitoriza bounces SMTP y evita spam en Gmail revisando Postmaster Tools.
Personalización avanzada con GraphQL
Adobe Commerce expone GraphQL para frontends headless. Puedes consumir mutations del checkout y disparar eventos a Klaviyo desde el cliente:
mutation SetEmailOnCart($cartId: String!, $email: String!) {
setGuestEmailOnCart(input: { cart_id: $cartId, email: $email }) {
cart { id email }
}
}En el resolver del frontend, tras la respuesta exitosa, dispara:
window._learnq = window._learnq || [];
_learnq.push(['identify', { '$email': email }]);
_learnq.push(['track', 'Started Checkout', { CartId: cartId, Total: total }]);Esto es esencial en PWA Studio o Vue Storefront, donde los observers PHP de carrito no se disparan en cada interacción.
Recursos relacionados
Si quieres profundizar, prueba estas herramientas gratuitas: Domain Health, mail tester, validador SPF y validador DMARC.
¿Necesitas que alguien lleve tu canal de email entero? Abalola Mail es la agencia de retención y email marketing de Abalola para ecommerce: estrategia, producción y operación del stack sobre Klaviyo, Mailchimp o Brevo.