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

# Przechwytywanie add-to-cart

> Dlaczego Aftersell przejmuje add-to-cart, jak sprawdzić, czy formularz jest przechwytywany, i wszystkie sposoby, by wyłączyć z tego pojedynczy formularz.

Gdy kupujący klika **Dodaj do koszyka**, to zwykle Aftersell obsługuje dodanie sam, zamiast pozwolić na to motywowi. Ta strona wyjaśnia dlaczego, co to oznacza dla dodanych przez Ciebie skryptów, i jak wyłączyć to dla jednego formularza lub dla wszystkich.

Większość sklepów nigdy nie musi tu niczego zmieniać. Czytaj dalej, jeśli któryś z Twoich skryptów przestał odpalać się przy add-to-cart lub przycisk dodawania zachowuje się dziwnie.

<div id="what-interception-does">
  ## Co robi przechwytywanie
</div>

Aftersell nasłuchuje submitu add-to-cart wcześniej niż motyw. Gdy go rozpozna:

1. Zatrzymuje zdarzenie, żeby nic innego na stronie nie obsłużyło tego kliknięcia.
2. Sam wysyła dodanie do Shopify.
3. Otwiera drawer koszyka Aftersell.

Krok 1 jest najważniejszy i to właśnie z jego powodu istnieje ta strona.

<div id="why-it-exists">
  ## Dlaczego to istnieje
</div>

Bez tego oba koszyki reagują na to samo kliknięcie. Motyw dodaje produkt i otwiera swój drawer, Aftersell dodaje go i otwiera nasz, a kupujący widzi dwa koszyki, często z produktem dodanym dwukrotnie.

Zatrzymanie zdarzenia to najprostszy sposób, aby zagwarantować jedno dodanie i jeden koszyk.

<div id="what-it-costs">
  ## Co to kosztuje
</div>

Zatrzymanie zdarzenia zatrzymuje je dla **wszystkich**, nie tylko dla motywu. Każdy inny kod nasłuchujący tego samego add-to-cart przestaje działać: Twoje analityki, piksel śledzący, aplikacja subskrypcyjna lub zestawów, skrypt dodany przez Ciebie samodzielnie.

Zawodzi po cichu. W konsoli przeglądarki nic się nie pojawia, a samo dodanie nadal działa, więc typowym objawem jest raczej niepoprawna liczba niż coś widocznie zepsutego:

* Brak zdarzeń `add_to_cart` w GA4, Meta lub TikTok
* Aplikacja subskrypcyjna lub zestawów, która działa na stronie produktu, ale nie z poziomu koszyka
* Twój własny `addEventListener` na formularzu nigdy się nie odpala

Jeśli coś z tego brzmi znajomo, to właśnie stąd bierze się problem, a rozwiązanie jest poniżej.

<div id="when-aftersell-doesnt-intercept">
  ## Kiedy Aftersell nie przechwytuje
</div>

Przechwytywanie nie zawsze jest włączone. Aftersell zostawia add-to-cart w spokoju, gdy:

* **Rozpoznaje koszyk Twojego motywu.** Na motywach, z którymi Aftersell wie, jak współpracować, zamiast blokować zdarzenie, sprawia, że własny koszyk motywu staje się bezczynny, a następnie pozwala motywowi wykonać dodanie normalnie. Twoje skrypty działają tak jak zawsze. Zobacz [Które motywy](#which-themes-aftersell-recognizes) poniżej.
* **Formularz nie dodaje pozycji.** Formularz bez `id` wariantu i bez `items[]` jest zostawiony w spokoju.
* **Zrezygnowałeś z tego** jedną z poniższych metod.

Gdy Aftersell nie wykonuje dodania, i tak nadal śledzi żądanie koszyka i otwiera drawer, gdy je zobaczy. Zobacz [Zanim wybierzesz: co się zmienia](#before-you-choose-what-changes).

<div id="which-themes-aftersell-recognizes">
  ## Które motywy Aftersell rozpoznaje
</div>

| Motyw                                      |                                                                                             |
| ------------------------------------------ | ------------------------------------------------------------------------------------------- |
| **Dawn** i reszta darmowej rodziny Shopify | Craft, Colorblock, Crave, Origin, Publisher, Refresh, Ride, Sense, Spotlight, Studio, Taste |
| **Horizon**                                | Aktualny domyślny motyw Shopify                                                             |
| **Impulse**                                |                                                                                             |

Aftersell dopasowuje na podstawie **tego, jak motyw jest zbudowany**, nie po jego nazwie, więc niestandardowy motyw sforkowany z któregoś z powyższych jest zwykle również rozpoznawany, w tym prywatne buildy, których Aftersell nigdy nie widział.

<Note>
  Zdarza się też odwrotnie: mocno zmodyfikowany build może odejść od swojego rodzica na tyle, że Aftersell przestaje go rozpoznawać, mimo że motyw dalej nazywa się „Dawn”. Bycie na tej liście czyni rozpoznanie prawdopodobnym, ale nie pewnym.
</Note>

<div id="your-options">
  ## Twoje opcje
</div>

Wybierz najwęższą, która rozwiązuje Twój problem. Każdy kolejny wiersz oddaje więcej niż poprzedni.

| Opcja                                                                | Zakres                                | Aftersell nadal otwiera drawer |
| -------------------------------------------------------------------- | ------------------------------------- | ------------------------------ |
| [`registerSkipAddToCartRule`](#per-form-a-rule-in-code)              | Formularze, które wskaże Twoja reguła | Tak, z żądania koszyka         |
| [`aftersell-cart-skip-atc`](#per-form-a-class-in-your-theme)         | Jeden formularz lub przycisk          | Tak, z żądania koszyka         |
| [`skip_add_to_cart_interceptor`](#whole-store-turn-interception-off) | Każdy formularz w sklepie             | Tak, z żądania koszyka         |

<div id="before-you-choose-what-changes">
  ### Zanim wybierzesz: co się zmienia
</div>

Rezygnacja z przechwytywania oddaje dodanie z powrotem Twojemu motywowi, co rodzi dwa pytania, na które warto odpowiedzieć przed wyborem wiersza: czy Twój koszyk nadal się otworzy i czy koszyk motywu pojawi się obok niego.

#### Czy Twój koszyk nadal się otworzy?

Zwykle tak, bez pracy z Twojej strony. Kto by nie wykonywał dodania, Aftersell śledzi żądanie idące do Shopify i otwiera drawer, gdy je zobaczy, zgodnie z Twoim zwykłym ustawieniem **Open cart when an item is added**. Nie musisz nic sam wywoływać.

Trzy sytuacje to psują, i wszystkie trzy mają rozwiązanie:

**Dodanie idzie gdzie indziej niż na endpointy koszyka Shopify.** Aftersell śledzi `/cart/add`, `/cart/change`, `/cart/update` i `/cart/clear` na Twojej własnej domenie. Aplikacja, która dodaje przez własny endpoint i następnie synchronizuje koszyk, nie jest dla tego widoczna. Otwórz koszyk sam, gdy dodanie tej aplikacji się zakończy:

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
window.aftersell.cart.actions.refresh().then(() => {
  window.aftersell.cart.actions.open();
});
```

**Między kliknięciem a żądaniem mija więcej niż mniej więcej trzy sekundy.** Aftersell traktuje dodanie, które ściśle podąża za prawdziwym kliknięciem lub naciśnięciem klawisza, jako inicjowane przez kupującego. Poza tym oknem jest ono uznawane za dodanie w tle, które nie otwiera drawera, chyba że włączysz taką opcję:

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
window.aftersell.cart.configure({ open_on_background_add: true });
```

**Twoje ustawienie koszyka mówi, że nie.** Jeśli **Open cart when an item is added** jest wyłączone lub ustawiłeś `open_on_add_to_cart: 'never'`, nic nie otworzy drawera. To działa zgodnie z konfiguracją.

#### Czy otworzy się też koszyk motywu?

To ryzyko, jakie niosą rezygnacje, a odpowiedź zależy od Twojego motywu.

Uczynienie koszyka motywu bezczynnym jest **oddzielone od przechwytywania** i dzieje się przy ładowaniu strony w obu przypadkach, więc żadna z tutejszych rezygnacji nie włącza go z powrotem. Na motywie z [listy rozpoznawanych](#which-themes-aftersell-recognizes) własny koszyk motywu pozostaje cichy i kupujący widzi jeden koszyk, Twój.

Na motywie, którego Aftersell nie rozpoznaje, nic nie powstrzymuje koszyka motywu. Rezygnacja oznacza, że motyw obsługuje dodanie dokładnie tak, jak zawsze to robił, wraz z otwarciem własnego drawera lub przekierowaniem do `/cart`, podczas gdy Aftersell otwiera swój drawer na podstawie żądania, które zobaczył. To dwa koszyki, i to jest powód, dla którego przechwytywanie w ogóle istnieje.

Jeśli tak się dzieje, masz trzy możliwości: zostaw przechwytywanie włączone dla tego formularza, użyj węższej rezygnacji, która nie obejmuje formularzy powodujących problem, albo sam zatrzymaj koszyk motywu w kodzie swojego motywu.

<Tip>
  Włącz rezygnację najpierw w motywie testowym lub nieopublikowanym. Jeśli własny koszyk motywu pojawia się tam, gdzie wcześniej się nie pojawiał, Twój motyw nie należy do tych, które Aftersell rozpoznaje, i lepiej zostawić przechwytywanie włączone dla tych formularzy.
</Tip>

<Note>
  Dotyczy to wyłącznie add-to-cart. Sprawienie, aby **ikona koszyka** omijała Aftersell za pomocą klasy `aftersell-cart-wont-open-cart`, to co innego: kliknięcie ikony koszyka nie wysyła żadnego żądania, więc Aftersell nie ma czego śledzić, a drawer się nie otworzy. Zobacz niżej.
</Note>

<div id="per-form-a-rule-in-code">
  ### Per formularz: reguła w kodzie
</div>

Preferowana opcja. Zarejestruj regułę zwracającą `true` dla formularzy, które chcesz zostawić w spokoju:

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
window.aftersell.cart.hooks.registerSkipAddToCartRule((form) =>
  form.hasAttribute('data-skip-aftersell')
);
```

Umieść to w **Cart settings → Custom script → Initialization**. Reguły są addytywne: Twoja działa obok pozostałych, a każda reguła zwracająca `true` pomija dany formularz. Pełne szczegóły w [Hookach](/pl/aftersell/cart/sdk-hooks#registerskipaddtocartrule).

<div id="per-form-a-class-in-your-theme">
  ### Per formularz: klasa w Twoim motywie
</div>

Jeśli wolisz nie pisać reguły, dodaj klasę `aftersell-cart-skip-atc` w swoim motywie:

```html theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
<form action="/cart/add" method="post" class="aftersell-cart-skip-atc">
```

<Note>
  Przy submitcie formularza klasa musi być na **samym elemencie form**. Nadrzędny `div` nie zadziała. Dla przycisku, który dodaje do koszyka bez submitu formularza, klasa może być na przycisku lub na dowolnym elemencie wokół niego.
</Note>

<div id="whole-store-turn-interception-off">
  ### Cały sklep: wyłącz przechwytywanie
</div>

Opcja tępa. Add-to-cart zachowuje się dokładnie tak, jak pierwotnie w motywie, w każdym formularzu:

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
window.aftersell.cart.configure({ skip_add_to_cart_interceptor: true });
```

<Warning>
  Ta opcja jest odczytywana **raz, przy załadowaniu koszyka**. Działa tylko ze skryptu **Initialization** Twojego koszyka. Ustawienie jej później, wewnątrz `ready()` lub z handlera zdarzenia, nic nie robi i zawodzi po cichu.
</Warning>

Sięgaj po to tylko wtedy, gdy opcje per formularz się nie sprawdzają, na przykład gdy formularze, które musisz zwolnić, są tworzone przez inną aplikację i nie da się ich wiarygodnie rozpoznać.

<div id="the-cart-icon-is-separate">
  ## Ikona koszyka jest oddzielnym tematem
</div>

Ikoną koszyka w Twoim nagłówku zajmuje się własny interceptor, z własną rezygnacją. Wyłączenie przechwytywania add-to-cart nie zmienia tego, co robi ikona koszyka, i odwrotnie również.

Kliknięcie ikony koszyka otwiera drawer Aftersell zamiast przechodzić do `/cart`. Aby zostawić jedną ikonę lub przycisk w spokoju, dodaj do niego klasę `aftersell-cart-wont-open-cart` lub do dowolnego elementu wokół niego:

```html theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
<a href="/cart" class="aftersell-cart-wont-open-cart">Cart</a>
```

Ten element robi wtedy to, co każe mu robić Twój motyw, zwykle przechodzi na stronę koszyka. Aftersell jest całkowicie poza obrazem, więc **drawer się nie otworzy**. W przeciwieństwie do add-to-cart nie ma żadnego żądania do śledzenia, więc jeśli chcesz, aby Twój koszyk otworzył się z tego elementu, musisz to powiedzieć wprost:

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
document.querySelector('#my-cart-link').addEventListener('click', (event) => {
  event.preventDefault();
  window.aftersell.cart.actions.open();
});
```

Ten sam problem wyciszania obowiązuje też tutaj: ponieważ Aftersell zatrzymuje kliknięcie, Twoje analityki i piksele również nie widzą kliknięć ikony koszyka. Jeśli tylko to musisz naprawić, zachowaj drawer i przestań wyciszać kliknięcie:

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
window.aftersell.cart.configure({ skip_open_cart_interceptor: true });
```

Twoi nasłuchujący działają, drawer nadal się otwiera, a kliknięcie nadal nie prowadzi do `/cart`. Pełne szczegóły w [Konfiguracji](/pl/aftersell/cart/sdk-configure#skip_open_cart_interceptor).

<Note>
  Aby zmienić, *które* elementy otwierają koszyk, zamiast je wyłączać, użyj **Cart settings → Advanced → Cart icon selector**, a nie edytuj motywu.
</Note>

<div id="where-to-go-next">
  ## Co dalej
</div>

* **[Konfiguracja](/pl/aftersell/cart/sdk-configure)**: każda opcja SDK, w tym te wymienione tutaj.
* **[Hooki](/pl/aftersell/cart/sdk-hooks)**: kontrola per formularz i per pozycja.
* **[Otwórz drawer z page buildera](/pl/aftersell/cart/sdk-use-case-page-builder)**: dla Replo, PageFly, GemPages i niestandardowych przycisków, które dodają do koszyka po swojemu.