O que a interceptação faz
O Aftersell escuta o submit do adicionar ao carrinho antes do tema. Quando reconhece um, ele:- Interrompe o evento, para que nada mais na página trate aquele clique.
- Envia a adição ao Shopify por conta própria.
- Abre o drawer do Aftersell Cart.
Por que ela existe
Sem isso, os dois carrinhos respondem ao mesmo clique. O tema adiciona o item e abre o próprio drawer, o Aftersell adiciona e abre o nosso, e o comprador vê dois carrinhos, muitas vezes com o item adicionado duas vezes. Interromper o evento é a forma mais simples de garantir uma adição e um carrinho.O que isso custa
Interromper o evento o interrompe para todos, não apenas para o tema. Qualquer outro código escutando esse mesmo adicionar ao carrinho para de rodar: as suas analytics, um pixel de rastreamento, um app de assinatura ou de bundle, um script que você mesmo adicionou. Ele falha silenciosamente. Nada aparece no console do navegador, e a adição em si continua funcionando, então o sintoma habitual é um número errado em vez de algo visivelmente quebrado:- Eventos
add_to_cartfaltando no GA4, Meta ou TikTok - Um app de assinatura ou de bundle que funciona na página do produto, mas não pelo carrinho
- Seu próprio
addEventListenerno formulário nunca disparando
Quando o Aftersell não intercepta
A interceptação nem sempre está ligada. O Aftersell deixa o adicionar ao carrinho em paz quando:- Ele reconhece o carrinho do seu tema. Em temas com os quais o Aftersell sabe trabalhar, ele deixa o próprio carrinho do tema inerte em vez de bloquear o evento, e então deixa o tema realizar a adição normalmente. Seus scripts rodam como sempre rodaram. Veja Quais temas abaixo.
- O formulário não adiciona um line item. Um formulário sem
idde variante e semitems[]é deixado em paz. - Você optou por sair usando um dos métodos abaixo.
Quais temas o Aftersell reconhece
O Aftersell reconhece pelo modo como um tema é construído, não pelo nome, então um tema personalizado forkado de qualquer um destes normalmente também é reconhecido, incluindo builds privados que o Aftersell nunca viu.
O contrário também acontece: um build fortemente customizado pode se afastar do seu pai a ponto de o Aftersell não o reconhecer mais, mesmo que o tema ainda se chame “Dawn”. Estar nesta lista torna o reconhecimento provável, não certo.
Suas opções
Escolha a mais restrita que resolva seu problema. Cada linha abre mão de mais do que a anterior.Antes de escolher: o que muda
Optar por sair devolve a adição ao seu tema, o que levanta duas perguntas que vale responder antes de escolher uma linha: se o seu carrinho ainda abre e se o carrinho do tema aparece ao lado dele.Seu carrinho ainda vai abrir?
Normalmente sim, sem trabalho da sua parte. Seja quem for que realiza a adição, o Aftersell observa a requisição indo para o Shopify e abre o drawer quando a vê, seguindo a sua configuração normal de Open cart when an item is added. Você não precisa chamar nada por conta própria. Três situações quebram isso, e todas as três têm uma solução: A adição vai para outro lugar que não os endpoints de carrinho do Shopify. O Aftersell observa/cart/add, /cart/change, /cart/update e /cart/clear no seu próprio domínio. Um app que adiciona pelo próprio endpoint e sincroniza o carrinho depois não é visível para isso. Abra o carrinho você mesmo quando a adição desse app terminar:
open_on_add_to_cart: 'never', nada abre o drawer. Isso é o comportamento configurado.
O carrinho do tema também vai abrir?
Esse é o risco que as opções de opt-out carregam, e a resposta depende do seu tema. Deixar o carrinho do tema inerte é separado da interceptação e acontece no carregamento da página em ambos os casos, então nenhuma das opções de opt-out aqui religa isso. Em um tema da lista reconhecida, o próprio carrinho do tema fica quieto e o comprador vê um carrinho, o seu. Em um tema que o Aftersell não reconhece, não há nada segurando o carrinho do tema. Optar por sair significa que o tema trata a adição exatamente como sempre tratou, incluindo abrir o próprio drawer ou redirecionar para/cart, enquanto o Aftersell abre o drawer a partir da requisição que ele viu. Isso são dois carrinhos, e é o motivo pelo qual a interceptação existe.
Se isso acontecer, você tem três escolhas: deixar a interceptação ligada para aquele formulário, usar um opt-out mais restrito que não cubra os formulários que estão causando o problema, ou parar o próprio carrinho do tema você mesmo no código do tema.
Isto se aplica apenas ao adicionar ao carrinho. Fazer o ícone do carrinho ignorar o Aftersell com a classe
aftersell-cart-wont-open-cart é diferente: um clique no ícone do carrinho não envia requisição, então não há nada para o Aftersell observar, e o drawer não vai abrir. Veja abaixo.Por formulário: uma regra em código
A opção preferida. Registre uma regra que retornetrue para os formulários que você quer deixar em paz:
true pula aquele formulário. Detalhes completos em Hooks.
Por formulário: uma classe no seu tema
Se você prefere não escrever uma regra, adicione a classeaftersell-cart-skip-atc no seu tema:
Para um submit de formulário, a classe precisa estar no próprio elemento de formulário. Um
div pai não funciona. Para um botão que adiciona ao carrinho sem um submit de formulário, a classe pode estar no botão ou em qualquer elemento ao redor dele.Loja inteira: desligar a interceptação
A opção bruta. O adicionar ao carrinho passa a se comportar exatamente como o seu tema originalmente se comportava, em cada formulário:O ícone do carrinho é separado
O ícone do carrinho no seu cabeçalho é tratado pelo próprio interceptor, com o próprio opt-out. Desligar a interceptação do adicionar ao carrinho não muda o que o ícone do carrinho faz, e o inverso também é verdadeiro. Clicar no ícone do carrinho abre o drawer do Aftersell em vez de ir para/cart. Para deixar um ícone ou botão em paz, adicione a classe aftersell-cart-wont-open-cart a ele, ou a qualquer elemento ao redor:
/cart. Detalhes completos em Configure.
Para mudar quais elementos abrem o carrinho em vez de desligá-los, use Cart settings → Advanced → Cart icon selector em vez de editar o seu tema.
Para onde ir a seguir
- Configure: cada opção do SDK, incluindo as referenciadas aqui.
- Hooks: controle por formulário e por linha.
- Abrir o drawer a partir de um page builder: para Replo, PageFly, GemPages e botões personalizados que adicionam ao carrinho à sua maneira.