Ocultar y reetiquetar líneas del carrito

Oculta líneas que el comprador no debería ver, renombra líneas que se leen mal y controla el orden en que todo se renderiza, todo sin tocar lo que realmente está en el carrito. Esto reemplaza el patrón antiguo de ocultar elementos del carrito con CSS o style.display = 'none'. Una transformación de línea se aplica cada vez que el carrito se renderiza, así que sobrevive a actualizaciones, re-renderizados y reaperturas del drawer.

Ocultar una línea

// Hide free lines from the drawer. The cart total is unchanged.
window.aftersell.cart.hooks.registerLineTransform((line) => {
  if (line.finalLinePrice === 0) {
    line.setHidden(true);
  }
});

Ocultar no es eliminar. Una línea oculta permanece en el carrito del comprador, permanece en el total y llega al checkout; simplemente no se dibuja en el drawer. Sí desaparece de getCart().items y de itemCount, así que tu propio código también deja de verla. Si quieres que desaparezca de verdad, usa removeItem.

Cosas comunes que vale la pena ocultar:

window.aftersell.cart.hooks.registerLineTransform((line) => {
  // An app-injected line, tagged with a private property.
  if (line.properties?._bundle_child) {
    line.setHidden(true);
  }

  // A specific SKU that shouldn't be shopper-managed.
  if (line.variantId === HIDDEN_VARIANT_ID) {
    line.setHidden(true);
  }

  // Gift cards issued by a loyalty app.
  if (line.isGiftCard && line.finalLinePrice === 0) {
    line.setHidden(true);
  }
});

Reetiquetar una línea

window.aftersell.cart.hooks.registerLineTransform((line) => {
  // Flag discounted lines.
  if (line.finalLinePrice < line.originalLinePrice) {
    line.setTitle(`${line.title} (On sale)`);
  }

  // Make the subscription cadence read naturally.
  if (line.sellingPlan) {
    line.setVariantTitle(`Delivered ${line.sellingPlan.name.toLowerCase()}`);
  }

  // Drop a meaningless variant label.
  if (line.variantTitle === 'Default Title') {
    line.setVariantTitle(null);
  }
});

Los cuatro setters disponibles en una línea:

Setter	Efecto
`setHidden(bool)`	Oculta la línea del drawer.
`setTitle(string)`	Cambia el título mostrado.
`setVariantTitle(string \| null)`	Cambia la etiqueta de variante mostrada. `null` la elimina.
`setInternalProperties(obj)`	Fusiona propiedades de solo renderizado, para que un bloque Custom code las lea. Nunca se persisten en Shopify.

Controlar el orden

Un comparador toma la misma forma que espera Array.prototype.sort, y se ejecuta después de ocultar y renombrar:

// Subscriptions first, then everything else.
window.aftersell.cart.hooks.registerLineComparator((lineA, lineB) => {
  return (lineB.sellingPlan ? 1 : 0) - (lineA.sellingPlan ? 1 : 0);
});

// Push free gifts and add-ons to the bottom.
window.aftersell.cart.hooks.registerLineComparator((lineA, lineB) => {
  return (lineA.finalLinePrice === 0 ? 1 : 0) - (lineB.finalLinePrice === 0 ? 1 : 0);
});

Devuelve 0 para los pares que no te importan. Los comparadores se componen como criterios de desempate, así que el primero en devolver un valor distinto de cero decide ese par, y devolver 0 le pasa la decisión al siguiente en lugar de imponerle un orden.

Ocultar un bloque completo, no una línea

Una transformación de línea funciona sobre las líneas del carrito. Para mostrar configuraciones de bloque diferentes por país, mercado o moneda (por ejemplo, distintos niveles de Rewards), usa las condiciones en el editor del carrito. No se requiere código, y sobrevive a rediseños del carrito. El total del carrito y el contenido del carrito no son tipos de condición del editor. Recurre al SDK cuando tu regla sea algo que las condiciones no pueden expresar (IDs de producto en el carrito, un total personalizado, etcétera). En ese caso, consulta el shadow root buscando una clase pública cart-external-*:

window.aftersell.cart.events.on('cart_updated', (state) => {
  const root = window.aftersell.cart.shadowRoot;
  if (!root) return;

  const rewards = root.querySelector('.cart-external-rewards');
  if (!rewards) return;

  const hasExcluded = state.items.some((line) => EXCLUDED_PRODUCT_IDS.includes(line.productId));
  rewards.style.display = hasExcluded ? 'none' : '';
});

Esto se ejecuta después de cada renderizado, así que el bloque puede aparecer fugazmente antes de que tu código lo oculte. El renderizado condicional no tiene ese problema, así que prefiérelo donde encaje.

Cosas que hay que hacer bien

Las transformaciones son llamadas de configuración. Regístralas al principio de tu script de Initialization; no se necesita ready().
Las transformaciones de todos se ejecutan. La tuya se compone con cualquiera registrada por otras apps. No puedes reemplazar las suyas, y ellas no pueden descartar la tuya.
Una transformación no puede cambiar el precio, la cantidad ni la identidad. Solo cambia lo que se renderiza. Usa las acciones para cambios reales.
Una transformación que lanza una excepción se omite silenciosamente. El resto sigue ejecutándose. Revisa aftersellCartDebugEvents mientras desarrollas.
registerLineTransform devuelve una función de anulación de registro, si necesitas deshacerlo más tarde.

Adónde ir después

Hooks: la referencia completa de hooks.
Objeto cart: cada campo sobre el que puedes ramificar.
Custom CSS: la convención de clases cart-external-*.

Primeros pasos

Página de inicio

Mejores prácticas

Ventas adicionales poscompra

Carrito de Aftersell

Ventas adicionales en el pago (Shopify Plus)

Página de agradecimiento

Ventas adicionales en la página de producto

Rokt Thanks

Estrategias

Analíticas y seguimiento

Integraciones

Aftersell MCP

Facturación y cuenta

Solución de problemas

Ocultar y reetiquetar líneas del carrito

Ocultar una línea

Reetiquetar una línea

Controlar el orden

Ocultar un bloque completo, no una línea

Cosas que hay que hacer bien

Adónde ir después

​Ocultar una línea

​Reetiquetar una línea

​Controlar el orden

​Ocultar un bloque completo, no una línea

​Cosas que hay que hacer bien

​Adónde ir después

Ocultar una línea

Reetiquetar una línea

Controlar el orden

Ocultar un bloque completo, no una línea

Cosas que hay que hacer bien

Adónde ir después