> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Cómo usar enlaces UTM directos al checkout

> Aprende a activar embudos post-compra usando parámetros UTM, incluida la configuración de enlaces directos al checkout

Aftersell admite la activación de embudos según parámetros UTM, una función opcional pensada específicamente para casos de uso avanzados. Puedes configurar tu embudo para que se active cuando un cliente visita tu sitio con una cadena de consulta UTM específica.

Esta configuración es opcional y normalmente solo se requiere para necesidades avanzadas de seguimiento, como enlaces directos al checkout u ofertas específicas de campañas.

<div id="how-utm-triggers-work">
  ## Cómo funcionan los activadores UTM
</div>

Los activadores UTM te permiten mostrar embudos post-compra específicos según los parámetros UTM de la URL. Esto es útil para:

* **Ofertas específicas de campañas**: muestra diferentes upsells según la campaña de marketing
* **Enlaces directos al checkout**: activa embudos cuando los clientes se saltan la tienda en línea
* **Atribución de canales**: personaliza las ofertas según la fuente de tráfico (correo electrónico, redes sociales, anuncios)
* **Pruebas A/B**: prueba diferentes ofertas para distintas variaciones de campaña

<div id="quick-start-basic-utm-trigger-setup">
  ## Inicio rápido: configuración básica de activadores UTM
</div>

Para visitas estándar a la tienda en línea (no directas al checkout), puedes configurar los activadores UTM usando el app embed de Aftersell. Para ver cómo empezar rápidamente con los activadores UTM, mira este video:

<iframe src="https://go.screenpal.com/player/cOfD38nOD9i" title="How to set up UTM Triggers" allowFullScreen style={{ width: '100%', aspectRatio: '16/9', borderRadius: '12px' }} />

<div id="enable-the-utm-app-embed">
  ### Habilitar el app embed de UTM
</div>

Para rastrear parámetros UTM en las páginas de la tienda en línea:

1. En tu panel de administración de Shopify, ve a **Online Store > Themes**
2. Haz clic en **Customize** en tu tema activo
3. En el editor de temas, haz clic en el icono **App embeds** (pieza de rompecabezas) en la barra lateral izquierda
4. Busca **Aftersell UTM Tracker** y actívalo (**on**)
5. Haz clic en **Save**

Una vez habilitado, Aftersell capturará automáticamente los parámetros UTM cuando los clientes visiten tu tienda con enlaces UTM.

<div id="configure-utm-triggers-in-your-funnel">
  ### Configurar activadores UTM en tu embudo
</div>

Después de habilitar el app embed:

1. Ve a **Post-purchase Funnels** en el panel de administración de Aftersell
2. Crea o edita un embudo
3. En la sección **Triggers**, añade un activador **UTM Parameter**
4. Configura el parámetro UTM y el valor que quieres hacer coincidir
5. Guarda tu embudo

<div id="supported-utm-parameters">
  ## Parámetros UTM admitidos
</div>

Aftersell admite los siguientes parámetros UTM estándar:

* `utm_source` - Identifica la fuente de tráfico (p. ej., google, newsletter, facebook)
* `utm_medium` - Identifica el medio de marketing (p. ej., email, cpc, social)
* `utm_campaign` - Identifica la campaña específica (p. ej., spring\_sale, product\_launch)
* `utm_term` - Identifica las palabras clave de búsqueda de pago (p. ej., running+shoes)
* `utm_content` - Diferencia contenido o enlaces similares (p. ej., banner\_ad, text\_link)
* `utm_id` - Identifica el ID de la campaña (p. ej., campaign\_123)

Los seis parámetros se rastrean y pueden usarse para activar embudos.

<div id="partial-field-matching">
  ## Coincidencia parcial de campos
</div>

Al configurar activadores UTM, Aftersell admite la **coincidencia parcial** para los valores de los parámetros UTM. Esto significa:

* ✅ **Valor del activador:** `spring` → **Coincide con:** `spring_sale`, `spring_2026`, `early_spring`
* ✅ **Valor del activador:** `email` → **Coincide con:** `email_newsletter`, `promotional_email`
* ✅ **Valor del activador:** `sale` → **Coincide con:** `spring_sale`, `flash_sale`, `sale_2026`

Esta flexibilidad te permite crear activadores más amplios que coincidan con múltiples variaciones de campaña sin crear activadores independientes para cada una.

**Ejemplo:** si configuras un activador para que `utm_campaign` contenga `sale`, coincidirá con cualquier campaña que tenga "sale" en el nombre, como `spring_sale`, `summer_sale` o `flash_sale_2026`.

<div id="direct-to-checkout-utm-links">
  ## Enlaces UTM directos al checkout
</div>

La configuración básica mostrada en el video anterior **no** admite enlaces que envían a los clientes **directamente al checkout**. De forma predeterminada, Aftersell solo puede detectar parámetros UTM en las páginas de la tienda en línea. Esto se debe a que depende de un app embed del tema, que funciona solo en las páginas de la tienda y no en el checkout ni en la página de agradecimiento.

<div id="enable-utm-tracking-on-checkout-pages">
  ### Habilitar el seguimiento UTM en las páginas de checkout
</div>

Para rastrear parámetros UTM en la página de checkout (para enlaces directos al checkout), necesitas **añadir un píxel de Shopify** a tu tienda.

⚠️ **Limitaciones importantes:**

* Esta configuración requiere que el visitante tenga un **token de carrito** cuando llega al checkout a través de un enlace UTM. Sin un token de carrito, los datos UTM no se capturarán.
* **Los métodos de pago exprés (Shop Pay, Apple Pay, Google Pay) no son compatibles** porque omiten el carrito y no generan un token de carrito. Los clientes que usen el pago exprés no activarán embudos basados en UTM.

<div id="setting-up-the-shopify-pixel">
  ### Configurar el píxel de Shopify
</div>

Sigue estas instrucciones paso a paso para configurar el seguimiento UTM directo al checkout:

1. En tu panel de administración de Shopify, ve a **Settings > Customer Events**.
2. Haz clic en **Add Custom Pixel** y ponle el nombre que quieras.
3. En el menú desplegable **Permission**, selecciona **Analytics**. Este es el único permiso requerido.
4. Para el menú desplegable **Data Sale**, puedes elegir **Data collected does not qualify as data sale**. Aftersell mantiene todos los datos recopilados en privado y nunca los comparte con nadie más que contigo.
5. En el editor de código que aparece, pega el código proporcionado a continuación.
6. Haz clic en **Save** y luego en **Connect**.

```text theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
/**  
 * IMPORTANT: This pixel can only fire on sessions where the  
 * customer has a cart object, otherwise it will be skipped.  
 * For example, clicking "Buy Now" on a product page skips the cart,  
 * going directly to checkout.  
**/  
function processData({event, cartToken}) {  
  // TODO: Edit MYSHOPIFY_DOMAIN to your domain. E.g.  
  // const MYSHOPIFY_DOMAIN = 'example-store.myshopify.com';  
  const MYSHOPIFY_DOMAIN = '';  
  
  const enableDebug = false;  
  
  // DO NOT EDIT PAST HERE  
  const SESSION_STORAGE_KEY = 'as-customer-trigger-data';  
  const HOST = 'https://start.aftersell.app';  
  
  if (!MYSHOPIFY_DOMAIN) {  
    if (enableDebug) {  
      console.log("UTM pixel didn't fire because of missing Shopify domain");  
    }  
    return;  
  }  
  if (!cartToken) {  
    if (enableDebug) {  
      console.log("UTM pixel didn't fire because of missing cart token");  
    }  
  }  
    
  let existingCustomerData = null;  
  try {  
      existingCustomerData = JSON.parse(  
          sessionStorage.getItem(SESSION_STORAGE_KEY) || 'null'  
      );  
  } catch (ignore) {  
    if (enableDebug) {  
      console.log("UTM pixel didn't fire because malformed user data json");  
    }  
  }  
    
  const allowedUrlParams = [  
        'utm_source',  
        'utm_medium',  
        'utm_campaign',  
        'utm_term',  
        'utm_id',  
        'utm_content',  
    ];  
    
  const searchParams = new URLSearchParams(event.context.window.location.search);  
  let hasCustomerData = false;  
  const customerData = {};  
  for (const param of allowedUrlParams) {  
    const paramValue = searchParams.get(param) || existingCustomerData?.[param];  
    if (paramValue) {  
        hasCustomerData = true;  
        customerData[param] = paramValue;  
    }  
  }  
  
  if (hasCustomerData) {  
    sessionStorage.setItem(SESSION_STORAGE_KEY, JSON.stringify(customerData));  
  
    const postBody = {  
      shop: MYSHOPIFY_DOMAIN,  
      cartToken,  
      checkoutToken: event.data.checkout.token ?? undefined,  
      customerTriggerData: customerData,  
    };  
  
    if (enableDebug) {  
      console.log("UTM pixel fired with the following data:", postBody);  
    }  
      
    fetch(`\${HOST}/api/v1/storefrontSessions`, {  
        method: 'POST',  
        headers: {  
            'Content-Type': 'application/json',  
        },  
        body: JSON.stringify(postBody),  
    });  
  } else {  
    if (enableDebug) {  
      console.log("UTM pixel didn't fire because there was no data to send");  
    }  
  }  
}  
  
analytics.subscribe('checkout_started', (event) => {  
   // minimum realistic time between adding item to cart and clicking checkout  
    const COOKIE_POLLING_INTERVAL_MS = 500;  
  
    let currentCookieValue = getCookieValue({ cookie: document.cookie, cookieName: 'cart' });  
    processData({event, cartToken: currentCookieValue});  
  
    setInterval(() => {  
        const newCookieValue = getCookieValue({ cookie: document.cookie, cookieName: 'cart' });  
        if (newCookieValue !== currentCookieValue) {  
            currentCookieValue = newCookieValue;  
            processData({event, cartToken: newCookieValue});  
        }  
    }, COOKIE_POLLING_INTERVAL_MS);  
});  
  
function getCookieValue({ cookie, cookieName }) {  
    const cartCookieRegex = new RegExp(`^\${cookieName}=`);  
    const cartCookie = cookie  
        .split(';')  
        .map((val) => val.trim())  
        .find((val) => cartCookieRegex.test(val));  
    if (!cartCookie) return null;  
    const cartCookieValue = cartCookie.replace(`\${cookieName}=`, '');  
    return cartCookieValue;  
}
```

**Notas importantes de configuración:**

* **Edita `MYSHOPIFY_DOMAIN`:** debes reemplazar la cadena vacía con el dominio myshopify.com de tu tienda (p. ej., `'example-store.myshopify.com'`)
* **Habilita el modo de depuración (opcional):** establece `enableDebug = true` para ver los registros de consola al solucionar problemas
* **Parámetros admitidos:** el píxel rastrea los seis parámetros UTM estándar listados en el array `allowedUrlParams`

<div id="testing-your-utm-trigger-setup">
  ## Probar tu configuración de activadores UTM
</div>

Después de configurar los activadores UTM, usa esta lista de verificación para comprobar que todo funciona correctamente:

<div id="for-storefront-utm-tracking-app-embed">
  ### Para el seguimiento UTM en la tienda en línea (app embed)
</div>

* ✅ **App embed habilitado:** verifica que el app embed Aftersell UTM Tracker está activado en la configuración de tu tema
* ✅ **URL de prueba:** visita tu tienda con un parámetro UTM (p. ej., `yourstore.com?utm_campaign=test`)
* ✅ **Completa una compra:** añade un producto al carrito y completa el pago
* ✅ **Comprueba el embudo:** verifica que el embudo correcto aparece en la página de agradecimiento
* ✅ **Order Browser:** revisa el Order Browser de Aftersell para confirmar que el activador UTM fue detectado

<div id="for-direct-to-checkout-utm-tracking-shopify-pixel">
  ### Para el seguimiento UTM directo al checkout (píxel de Shopify)
</div>

* ✅ **Píxel instalado:** verifica que el píxel personalizado está guardado y conectado en Settings > Customer Events
* ✅ **Dominio configurado:** confirma que `MYSHOPIFY_DOMAIN` está configurado correctamente en el código del píxel
* ✅ **Token de carrito presente:** asegúrate de que el cliente tenga artículos en el carrito antes de ir al checkout (requerido para el seguimiento)
* ✅ **URL de prueba:** usa un enlace directo al checkout con parámetros UTM (p. ej., `yourstore.com/checkout?utm_campaign=test`)
* ✅ **Completa una compra:** completa el proceso de pago
* ✅ **Comprueba el embudo:** verifica que el embudo correcto aparece en la página de agradecimiento
* ✅ **Order Browser:** revisa el Order Browser de Aftersell para confirmar que el activador UTM fue detectado
* ⚠️ **Pago exprés:** recuerda que Shop Pay, Apple Pay y Google Pay NO funcionarán con activadores UTM

<div id="troubleshooting-tips">
  ### Consejos para solucionar problemas
</div>

Si los activadores UTM no funcionan:

1. **Habilita el modo de depuración:** establece `enableDebug = true` en el código del píxel y revisa la consola del navegador en busca de mensajes de error
2. **Verifica el token de carrito:** asegúrate de que los clientes tengan artículos en el carrito antes de llegar al checkout (el píxel requiere el token de carrito)
3. **Revisa la configuración del activador:** verifica que el parámetro UTM y el valor en el activador de tu embudo coincidan con los parámetros de la URL
4. **Prueba la coincidencia parcial:** recuerda que los activadores usan coincidencia parcial: `sale` coincidirá con `spring_sale`, `flash_sale`, etc.
5. **Comprueba la prioridad del embudo:** si varios embudos coinciden, solo se mostrará el de mayor prioridad
6. **Revisa el Order Browser:** usa el Order Browser de Aftersell para ver qué activadores se dispararon para cada pedido

<div id="best-practices-for-utm-triggers">
  ## Mejores prácticas para activadores UTM
</div>

* **Usa nombres consistentes:** establece una convención de nombres para tus parámetros UTM (p. ej., `utm_campaign=email_spring_2026`)
* **Aprovecha la coincidencia parcial:** usa valores de activador más amplios para coincidir con múltiples variaciones de campaña
* **Prueba antes de lanzar:** prueba siempre tus enlaces UTM y activadores antes de enviarlos a los clientes
* **Documenta tus campañas:** lleva un registro de qué parámetros UTM estás usando para cada campaña
* **Combínalos con otros activadores:** usa activadores UTM junto con activadores de producto o de valor del pedido para una segmentación más precisa
* **Supervisa el rendimiento:** revisa regularmente el Order Browser para ver qué campañas UTM generan más upsells