> ## 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.
# Otwieraj szufladę z page buildera
> Przypadek użycia Cart SDK: jak sprawić, by przyciski dodawania do koszyka w Replo, PageFly, GemPages i niestandardowe otwierały szufladę Aftersell Cart.
Aftersell przechwytuje dodawanie do koszyka na standardowych formularzach produktowych Shopify. Buildery stron docelowych często dodają do koszyka po swojemu, używając wywołania JavaScript zamiast przesłania formularza, więc produkt ląduje w koszyku, ale szuflada pozostaje zamknięta, albo kupujący jest przekierowywany na `/cart`.
## Rozwiązanie w jednej linii
Po zakończeniu dodawania do koszyka przez builder każ koszykowi ponownie pobrać dane i się otworzyć:
```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
window.aftersell.cart.actions.refresh().then(() => {
window.aftersell.cart.actions.open();
});
```
Dodaj to jako **drugą akcję** na przycisku, po własnym „add to cart” buildera, i wyłącz opcję buildera „go to cart” lub „redirect after add”.
Najpierw wypróbuj [`open_on_background_add`](#the-no-code-option-first), ponieważ często rozwiązuje to problem bez dotykania przycisku.
## Najpierw opcja bez kodu
Aftersell wykrywa dodania, których samo nie obsłużyło, na dwa sposoby. Oba działają cały czas — są podłączane razem przy starcie i żaden nie tłumi drugiego, więc jedno dodanie może być zgłoszone przez oba — a każde zgłoszenie stosuje regułę otwierania niezależnie:
* **Na łączu.** Aftersell obserwuje żądania do endpointów koszyka Shopify. Jeśli dodanie nastąpiło po prawdziwym kliknięciu lub naciśnięciu klawisza w ciągu około trzech sekund, liczy się jako inicjowane przez kupującego, a szuflada otwiera się zgodnie z Twoim zwykłym ustawieniem **Open cart when an item is added**. Każdy builder dodający przez Ajax cart API Shopify (`/cart/add.js`) trafia tutaj, co jest częstym przypadkiem — więc najpierw wypróbuj swój przycisk, może już działać bez żadnych zmian.
* **[Standardowe zdarzenia koszyka Shopify](https://shopify.dev/docs/storefronts/themes/best-practices/standard-events).** Dodanie zgłoszone w ten sposób jest zawsze traktowane jako dodanie *w tle*, niezależnie od tego, czy kupujący kliknął. Dodania w tle nie otwierają szuflady, chyba że się na to zdecydujesz:
```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
window.aftersell.cart.configure({ open_on_background_add: true });
```
Wklej to w **Cart settings → Custom script → Initialization**. Jeśli szuflada otwiera się teraz po przycisku dodawania Twojego buildera, to koniec — bez pracy per przycisk i z pokryciem każdej strony.
`open_on_background_add` obejmuje też dodania bez żadnego gestu kupującego — inną aplikację lub skrypt zapisujący do koszyka. Włącz to tylko wtedy, gdy chcesz, aby one również otwierały szufladę.
Jeśli żadna ze ścieżek nie otwiera szuflady, wróć do jawnego wywołania poniżej.
## Konfiguracja per builder
### Replo
1. Otwórz swoją stronę w edytorze Replo i zaznacz przycisk **Add to Cart**.
2. W prawym pasku bocznym otwórz zakładkę **Interactions**.
3. W sekcji **On Click** kliknij `+` i wybierz **Run JavaScript**.
4. Wklej:
```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
window.aftersell.cart.actions.refresh().then(() => {
window.aftersell.cart.actions.open();
});
```
5. Zaznacz ponownie interakcję **Add Product to Cart** i wyłącz **Go to cart after?**.
6. Zobacz podgląd, potwierdź, że szuflada się otwiera, a następnie opublikuj.
Powtórz na każdej stronie, która ma przycisk dodawania do koszyka.
### PageFly i GemPages
Oba pozwalają podpiąć niestandardowy JavaScript do kliknięcia przycisku lub dodać element niestandardowego kodu na stronę. Użyj tego samego fragmentu, podpiętego tak, aby uruchamiał się po akcji dodania do koszyka buildera, i wyłącz każde ustawienie „redirect to cart” na przycisku.
### Twój własny przycisk
Jeśli sam dodajesz do koszyka, pomiń podróż w obie strony i użyj własnej akcji SDK, która aktualizuje koszyk i może otworzyć szufladę w jednym kroku:
```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
document.querySelector('#my-add-button').addEventListener('click', () => {
window.aftersell.cart.actions.addItem(VARIANT_ID, 1).then(() => {
window.aftersell.cart.actions.open();
});
});
```
Używaj `refresh()` tylko wtedy, gdy coś *innego* zmieniło koszyk i potrzebujesz, aby Aftersell to nadrobił:
```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
fetch('/cart/add.js', { method: 'POST', /* … */ })
.then(() => window.aftersell.cart.actions.refresh())
.then(() => { window.aftersell.cart.actions.open(); });
```
## Gdy przycisk buildera powinien całkowicie omijać Aftersell
Czasem jest odwrotnie: formularz potrzebuje własnego przepływu, a przechwytywanie przez Aftersell przeszkadza. Wyłącz tylko ten formularz:
```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
window.aftersell.cart.hooks.registerSkipAddToCartRule((form) =>
form.hasAttribute('data-skip-aftersell')
);
```
Następnie dodaj `data-skip-aftersell` do formularza. To lepsze niż [`skip_add_to_cart_interceptor`](/pl/aftersell/cart/sdk-configure#skip_add_to_cart_interceptor), które wyłącza przechwytywanie dla każdego formularza na stronie.
Jeszcze prościej, jeśli możesz edytować znaczniki formularza: dodaj klasę **`aftersell-cart-skip-atc`** do `