> ## 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.

# Guía de inicio rápido de Upcart

> Aprende a activar Upcart, habilitar las funciones principales y publicar tu cajón del carrito en vivo.

Esta guía te acompaña en la configuración de Upcart con sus módulos principales, desde la personalización visual hasta la activación en tu tienda.

Upcart reemplaza visualmente el cajón del carrito de tu tema, pero **no se integra con el cajón del carrito ni con la página del carrito de tu tema**. La página del carrito de Shopify seguirá siendo accesible.

<div id="managing-modules">
  # **Gestión de módulos**
</div>

Cada módulo de Upcart se puede **habilitar o deshabilitar fácilmente**. Simplemente haz clic en el botón **Enable/Disable** en la esquina superior derecha para activar o desactivar un módulo en cualquier momento. Tus cambios entran en vigor de inmediato una vez guardados.

<img src="https://mintcdn.com/aftersell/uVGuDiyXpd6WOLO4/images/upcart/quickstart-announcements-module-row-disabled.png?fit=max&auto=format&n=uVGuDiyXpd6WOLO4&q=85&s=454a834d8ea953a99ba987dfdb80499a" alt="Fila del módulo Announcements marcada como Disabled con una flecha apuntando al botón Enable" width="1548" height="210" data-path="images/upcart/quickstart-announcements-module-row-disabled.png" />

<div id="cart-design">
  # Diseño del carrito
</div>

Cuando abres por primera vez el Cart Editor de Upcart, llegarás al [módulo Design](/es/upcart/design_module). Aquí puedes personalizar los colores base del cajón para que coincidan con la imagen de marca de tu tienda.

<img src="https://mintcdn.com/aftersell/uVGuDiyXpd6WOLO4/images/upcart/quickstart-cart-editor-design-module.png?fit=max&auto=format&n=uVGuDiyXpd6WOLO4&q=85&s=e15c4d0893916f9200cf1884c1d0adfe" alt="Módulo Design del Cart Editor de Upcart con ajustes de color junto a una vista previa en vivo del cajón del carrito" width="600" data-path="images/upcart/quickstart-cart-editor-design-module.png" />

<div id="announcements">
  # Anuncios
</div>

Para mostrar un mensaje en el carrito o un temporizador de cuenta regresiva, ve a **Body > [Announcements](/es/upcart/announcements_module)**.

En la esquina superior derecha, cambia el interruptor a **Active**, o haz clic en **Activate** en el mensaje naranja que aparece en la parte superior de la página.

<img src="https://mintcdn.com/aftersell/uVGuDiyXpd6WOLO4/images/upcart/quickstart-announcements-panel-disabled-notice.png?fit=max&auto=format&n=uVGuDiyXpd6WOLO4&q=85&s=10a332b398e64dc296c69fe5f5a3a11e" alt="Panel de Announcements mostrando el aviso Disabled con un botón Activate" width="600" data-path="images/upcart/quickstart-announcements-panel-disabled-notice.png" />

Ingresa tu mensaje en el campo **Announcement Text** y configura el temporizador si es necesario.

<img src="https://mintcdn.com/aftersell/uVGuDiyXpd6WOLO4/images/upcart/quickstart-announcement-settings-timer-text.png?fit=max&auto=format&n=uVGuDiyXpd6WOLO4&q=85&s=2a726b39f6ea92d5899e2aae2968c2d1" alt="Ajustes de anuncio con temporizador, campo de texto del anuncio y opciones de color" width="645" height="679" data-path="images/upcart/quickstart-announcement-settings-timer-text.png" />

Asegúrate de usar la variable `{TIMER}` para las cuentas regresivas dentro del texto de tu anuncio para garantizar un funcionamiento correcto (p. ej., "Esta oferta solo está disponible durante {TIMER}."). Evita copiar texto con formato directamente desde herramientas de terceros.

Cuando termines, asegúrate de hacer clic en **Save** en la esquina superior derecha.

<div id="theme-level-issues">
  #### Problemas a nivel del tema
</div>

* **Conflictos de CSS o de apps:** Asegúrate de que propiedades CSS como `display: none;` no estén ocultando la barra de anuncios. Además, verifica que las apps de terceros no estén anulando estos ajustes.
* **Visibilidad del texto:** Confirma que el color del texto de la barra de anuncios contraste con el fondo y ajústalo en los ajustes de tu tema si es necesario.

<div id="advanced-debugging-steps">
  #### Pasos avanzados de depuración
</div>

Para problemas persistentes, revisa los errores de la consola del navegador en busca de problemas de scripts que afecten la barra de anuncios y desactiva temporalmente las apps de terceros para identificar conflictos.

<div id="rewards">
  # Recompensas
</div>

Para mostrar una barra de progreso que anime a los clientes a gastar más, habilita el módulo Rewards.

<div id="general-settings">
  ### **Ajustes generales**
</div>

Configura los colores de tu marca y el mensaje que se muestra cuando se alcanza el último nivel de recompensa.\
Elige una base para las recompensas:

* **Cart Total**: Realiza el seguimiento del valor total del carrito
* **Item Count**: Realiza el seguimiento de la cantidad de artículos

<img src="https://mintcdn.com/aftersell/uVGuDiyXpd6WOLO4/images/upcart/quickstart-rewards-module-general-settings.png?fit=max&auto=format&n=uVGuDiyXpd6WOLO4&q=85&s=d702c06541f1304d2d2e742f79d62140" alt="Ajustes generales del módulo Rewards con colores de la barra y campos del mensaje de finalización" width="600" data-path="images/upcart/quickstart-rewards-module-general-settings.png" />

<div id="rewards-settings-choose-your-reward-type">
  ### **Ajustes de recompensas** Elige tu tipo de recompensa:
</div>

* [**Shipping**](https://help.shopify.com/en/manual/fulfillment/setup/shipping-rates/flat-shipping-rates): Considera los descuentos aplicados
* [**Discount**](https://help.shopify.com/en/manual/discounts/discount-types): Ignora los descuentos
* [**Product**](/es/upcart/set_up_a_free_product_reward_tier_in_upcart): Agrega un producto al carrito

Establece un umbral mínimo para activar la recompensa y personaliza el campo "Text before achieving". Puedes crear hasta **cuatro niveles de recompensa**.

<img src="https://mintcdn.com/aftersell/uVGuDiyXpd6WOLO4/images/upcart/quickstart-rewards-settings-reward-type.png?fit=max&auto=format&n=uVGuDiyXpd6WOLO4&q=85&s=2085093e9f85cdd42ed163fab7d726db" alt="Ajustes de recompensas con tipo de recompensa, importe mínimo y campos de texto antes de alcanzarla" width="600" data-path="images/upcart/quickstart-rewards-settings-reward-type.png" />

<div id="upsells">
  # Upsells
</div>

Habilita **Use AI Recommended Upsells**, selecciona el algoritmo **Related** y activa **Smart Variant Matching** para preseleccionar las variantes de producto coincidentes según el contenido del carrito.

<img src="https://mintcdn.com/aftersell/uVGuDiyXpd6WOLO4/images/upcart/quickstart-upsells-settings-ai-recommended.png?fit=max&auto=format&n=uVGuDiyXpd6WOLO4&q=85&s=65cddd8e07bfe9e9805ce76e43377ab3" alt="Ajustes de upsells con upsells recomendados por IA, algoritmo Related y coincidencia inteligente de variantes habilitados" width="600" data-path="images/upcart/quickstart-upsells-settings-ai-recommended.png" />

Personaliza el título de tu sección y la etiqueta del botón **Add**.

<img src="https://mintcdn.com/aftersell/uVGuDiyXpd6WOLO4/images/upcart/quickstart-upsell-fields-maximum-upsells.png?fit=max&auto=format&n=uVGuDiyXpd6WOLO4&q=85&s=58ad7bd0311baa003f3ea5dae376505d" alt="Campos de upsell para el máximo de upsells a mostrar y el texto del título de la sección" width="600" data-path="images/upcart/quickstart-upsell-fields-maximum-upsells.png" />

<div id="add-ons">
  # Complementos
</div>

Para mostrar un complemento con interruptor en el pie de página, puedes habilitar cualquiera de estas opciones:

<div id="shipping-protection">
  ### **Protección de envío**
</div>

Selecciona **Shipping Protection** y configura niveles de precios dinámicos según el valor del carrito.\
Esto crea un producto real en tu catálogo de Shopify.

<img src="https://mintcdn.com/aftersell/uVGuDiyXpd6WOLO4/images/upcart/quickstart-shipping-protection-add-settings.png?fit=max&auto=format&n=uVGuDiyXpd6WOLO4&q=85&s=a8432cf06443d21b7c341a0942ef7d7e" alt="Ajustes del complemento Shipping Protection con título, descripción y niveles de precios" width="862" height="708" data-path="images/upcart/quickstart-shipping-protection-add-settings.png" />

<div id="product-add-on">
  ### **Complemento de producto**
</div>

Cambia a la pestaña **Product Add-On** y selecciona un producto existente para ofrecerlo como upsell.

<img src="https://mintcdn.com/aftersell/uVGuDiyXpd6WOLO4/images/upcart/quickstart-product-add-on-energy-drink.png?fit=max&auto=format&n=uVGuDiyXpd6WOLO4&q=85&s=d7eaf37fa102b147636bfae244fef54c" alt="Pestaña de complemento de producto con un producto Energy Drink seleccionado y el botón Change Product" width="862" height="428" data-path="images/upcart/quickstart-product-add-on-energy-drink.png" />

<div id="activating-upcart-on-your-store">
  # Activación de Upcart en tu tienda
</div>

<div id="step-one-make-your-cart-live">
  ### Paso uno: Pon tu carrito en vivo
</div>

Una vez que todo esté configurado:

Nota: El app embed controla si el cajón del carrito de Upcart se muestra en tu tienda. Si tienes Discounts configurados, esas reglas seguirán activas a través del sistema de descuentos de Shopify incluso cuando el app embed esté deshabilitado.

<div id="step-2-test-compatibility">
  ### **Paso 2: Prueba la compatibilidad**
</div>

ve a **Manage All Carts** > selecciona el carrito que quieres activar > haz clic en **Publish**.

Una vez publicado, aparecerá una insignia verde **"Live"** junto al nombre del carrito confirmando que está activo en tu tienda.

<img src="https://mintcdn.com/aftersell/uVGuDiyXpd6WOLO4/images/upcart/quickstart-publish-cart-confirmation.gif?s=e8cc3d709577ee5a1ab9848afb9f6269" alt="Publicación de un carrito en Upcart con el diálogo de confirmación de Publish abierto" width="2008" height="1080" data-path="images/upcart/quickstart-publish-cart-confirmation.gif" />

<div id="step-two-enable-theme-app-embed">
  ### **Paso dos: Habilita el Theme App Embed**
</div>

Para activar Upcart en tu tema, ve a **Shopify Admin → Online Store → Themes → Customize → App Embeds**, habilita el **Upcart Bridge** y haz clic en **Save**.

<img src="https://mintcdn.com/aftersell/uVGuDiyXpd6WOLO4/images/upcart/quickstart-app-embed-toggle.gif?s=9244c8509f67622ebb4e1cc2af7ecebb" alt="Habilitando el interruptor Upcart Cart Drawer en el panel App embeds del tema de Shopify" width="1352" height="1080" data-path="images/upcart/quickstart-app-embed-toggle.gif" />

Si encuentras algún problema o experimentas problemas de compatibilidad, no dudes en contactar a nuestro **Support Chat** para recibir asistencia.
