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

# Configurações do carrinho

> Configurações de comportamento do Aftersell Cart — quando o drawer abre e os seletores de tema que mantêm sua loja sincronizada.

Além da [estilização](/pt/aftersell/cart/design-settings), o carrinho tem algumas configurações de **comportamento** que controlam como ele interage com sua loja — quando o drawer abre e quais elementos do tema a Aftersell mantém sincronizados com o carrinho.

<div id="where-to-find-these">
  ## Onde encontrar
</div>

No Cart Editor, abra **Cart settings**. As opções abaixo estão agrupadas em **Behavior** e **Custom selector**.

<div id="open-the-cart-when-an-item-is-added">
  ## Abrir o carrinho quando um item é adicionado
</div>

**Open cart when an item is added** controla se o drawer abre automaticamente toda vez que um comprador adiciona um produto. Fica ativado por padrão. Desative se você preferir que o carrinho permaneça fechado até que o comprador o abra por conta própria.

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

A Aftersell se conecta à sua loja por meio de seletores CSS — por exemplo, para saber qual elemento abre o carrinho, ou qual contagem do ícone do carrinho manter sincronizada. A detecção nativa cobre os temas Shopify mais populares (Dawn, Sense, Crave, Debut, Impulse, Horizon e muitos outros), então **a maioria das lojas nunca precisa mexer nisso**. Ajuste um seletor apenas se algo não estiver funcionando corretamente no seu tema.

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

Cada seletor oferece os mesmos três modos:

| Modo                 | O que faz                                                                                                                                                                                  |
| -------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| **Default**          | Usa a detecção nativa da Aftersell para temas suportados.                                                                                                                                  |
| **Default + custom** | Mantém a detecção nativa e adiciona seu próprio seletor por cima — use quando o padrão funciona na maior parte, mas deixa passar um elemento (por exemplo, um ícone separado para mobile). |
| **Custom only**      | Ignora a detecção nativa e usa apenas o seu seletor — use quando o padrão mira o elemento errado ou entra em conflito com o seu tema.                                                      |

O campo de seletor fica habilitado apenas nos modos **Default + custom** e **Custom only**.

<div id="the-three-selectors">
  ### Os três seletores
</div>

| Seletor                  | O que ele mira                                                                                                       | Exemplo                     |
| ------------------------ | -------------------------------------------------------------------------------------------------------------------- | --------------------------- |
| **Open cart selector**   | O(s) elemento(s) que devem abrir o cart drawer.                                                                      | `.header__cart-toggle`      |
| **Add to cart selector** | O(s) botão(ões) de adicionar ao carrinho aos quais a Aftersell deve se conectar.                                     | `.product-form__add-button` |
| **Cart count selector**  | O elemento no ícone de carrinho do seu tema que exibe a contagem de itens, para que fique sincronizado com o drawer. | `.header__cart-count span`  |

<div id="how-to-find-a-selector">
  ### Como encontrar um seletor
</div>

1. Abra sua loja em um navegador (Chrome recomendado).
2. Clique com o botão direito no elemento que você quer mirar — seu ícone de carrinho, o número da contagem ou o botão de adicionar ao carrinho — e escolha **Inspecionar**.
3. No painel que abrir, encontre o elemento que o representa (a contagem costuma ser um `span` dentro do ícone do carrinho).
4. Anote sua classe (começa com `.`) ou ID (começa com `#`) — por exemplo `.header__cart-count span` ou `#CartCount`.
5. De volta em **Cart settings**, defina o seletor como **Default + custom** ou **Custom only** e cole-o.
6. Salve e teste tanto no desktop quanto no mobile.

<Tip>
  Comece com **Default** — funciona para a maioria dos temas sem nenhuma configuração. Recorra a **Default + custom** quando apenas um de vários ícones for atualizado (digamos, o desktop funciona, mas o mobile não), e a **Custom only** quando o padrão estiver mirando o elemento errado. Se você não tiver certeza de qual seletor usar, o desenvolvedor do seu tema pode indicá-lo — você não precisa escrever nenhum código, apenas copiar e colar.
</Tip>
