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

# Configuración del carrito

> Configuraciones de comportamiento del Aftersell Cart: cuándo se abre el cajón y los selectores de tema que mantienen tu tienda sincronizada.

Más allá del [estilo](/es/aftersell/cart/design-settings), el carrito tiene algunas configuraciones de **comportamiento** que controlan cómo interactúa con tu tienda: cuándo se abre el cajón y qué elementos del tema Aftersell mantiene sincronizados con el carrito.

<div id="where-to-find-these">
  ## Dónde encontrarlas
</div>

En el editor de carrito, abre **Cart settings**. Las opciones a continuación están agrupadas bajo **Behavior** y **Custom selector**.

<div id="open-the-cart-when-an-item-is-added">
  ## Abrir el carrito cuando se agrega un artículo
</div>

**Open cart when an item is added** controla si el cajón se abre automáticamente cada vez que un comprador agrega un producto. Está activado de forma predeterminada. Desactívalo si prefieres que el carrito permanezca cerrado hasta que el comprador lo abra por sí mismo.

<div id="theme-selectors">
  ## Selectores de tema
</div>

Aftersell se engancha a tu tienda a través de selectores CSS; por ejemplo, para saber qué elemento abre el carrito o qué recuento del ícono del carrito mantener sincronizado. La detección integrada cubre los temas de Shopify más populares (Dawn, Sense, Crave, Debut, Impulse, Horizon y muchos otros), por lo que **la mayoría de las tiendas nunca necesitan tocar esto**. Ajusta un selector solo si algo no se conecta correctamente en tu tema.

<div id="selector-modes">
  ### Modos de selector
</div>

Cada selector ofrece los mismos tres modos:

| Modo                 | Qué hace                                                                                                                                                                                 |
| -------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Default**          | Usa la detección integrada de Aftersell para los temas compatibles.                                                                                                                      |
| **Default + custom** | Mantiene la detección integrada y agrega tu propio selector encima; úsalo cuando el predeterminado funciona en su mayoría pero omite un elemento (por ejemplo, un ícono móvil separado). |
| **Custom only**      | Ignora la detección integrada y usa solo tu selector; úsalo cuando el predeterminado apunta al elemento equivocado o entra en conflicto con tu tema.                                     |

El campo del selector está habilitado solo para los modos **Default + custom** y **Custom only**.

<div id="the-three-selectors">
  ### Los tres selectores
</div>

| Selector                 | A qué apunta                                                                                                                       | Ejemplo                     |
| ------------------------ | ---------------------------------------------------------------------------------------------------------------------------------- | --------------------------- |
| **Open cart selector**   | El o los elementos que deben abrir el cajón del carrito.                                                                           | `.header__cart-toggle`      |
| **Add to cart selector** | El o los botones de agregar al carrito a los que Aftersell debe engancharse.                                                       | `.product-form__add-button` |
| **Cart count selector**  | El elemento del ícono del carrito de tu tema que muestra el recuento de artículos, para que se mantenga sincronizado con el cajón. | `.header__cart-count span`  |

<div id="how-to-find-a-selector">
  ### Cómo encontrar un selector
</div>

1. Abre tu tienda en un navegador (se recomienda Chrome).
2. Haz clic derecho en el elemento al que quieres apuntar —tu ícono del carrito, el número del recuento o el botón de agregar al carrito— y elige **Inspeccionar**.
3. En el panel que se abre, encuentra el elemento que lo representa (el recuento suele ser un `span` dentro del ícono del carrito).
4. Anota su clase (comienza con `.`) o su ID (comienza con `#`); por ejemplo, `.header__cart-count span` o `#CartCount`.
5. De vuelta en **Cart settings**, configura el selector en **Default + custom** o **Custom only** y pégalo.
6. Guarda y luego prueba tanto en escritorio como en móvil.

<Tip>
  Comienza con **Default**: funciona para la mayoría de los temas sin configuración. Recurre a **Default + custom** cuando solo uno de varios íconos se actualiza (digamos, el de escritorio funciona pero el móvil no), y a **Custom only** cuando el predeterminado apunta al elemento equivocado. Si no estás seguro de qué selector usar, el desarrollador de tu tema puede indicártelo; no necesitas escribir código, solo copiar y pegar.
</Tip>