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

# Jak skonfigurować widżety checkout

> Kompletny przewodnik krok po kroku po konfiguracji widżetów checkout w Aftersell, w tym wszystkie typy widżetów, opcje rozmieszczenia i najlepsze praktyki konwersji dla urządzeń mobilnych i desktopów

Ten przewodnik pokazuje, jak konfigurować i rozmieszczać widżety checkout w Aftersell — od włączania widżetów po optymalizację rozmieszczenia w Shopify Checkout w celu maksymalizacji współczynników konwersji.

**Uwaga:** widżety checkout są dostępne tylko dla sprzedawców Shopify Plus ze względu na ograniczenia API Checkout Extensibility Shopify.

***

<div id="step-1-enable-your-widget-in-aftersell">
  ## Krok 1: Włącz widżet w Aftersell
</div>

Zanim dodasz widżety do checkoutu, musisz je włączyć w panelu administracyjnym Aftersell.

1. Przejdź do zakładki **Checkout** w panelu administracyjnym Aftersell
2. Wybierz typ widżetu, który chcesz skonfigurować ([Upsells](#upsells), [Cart Controls](#cart-controls), [Rewards,](#rewards) [Trust Badges,](#trust-badges) [Testimonials](#testimonials), [Notes](#notes), [Images](#images) lub [Text](#text))
3. Kliknij **Create**, aby zbudować nowy widżet, lub wybierz istniejący widżet do edycji
4. Skonfiguruj ustawienia widżetu (zobacz [Typy widżetów i konfiguracja](#widget-types-and-configuration) poniżej)
5. Kliknij przełącznik **Enable** w prawym górnym rogu ustawień widżetu
6. W przypadku ograniczonych lub zaawansowanych upselli upewnij się, że przed kontynuowaniem włączysz niestandardowe wyzwalacze

***

<div id="step-2-open-the-shopify-checkout-editor">
  ## Krok 2: Otwórz edytor Shopify Checkout
</div>

Istnieją dwa sposoby dostępu do edytora Shopify Checkout:

**Opcja 1: Z panelu administracyjnego Shopify**

1. Przejdź do **Settings** w panelu administracyjnym Shopify
2. Kliknij **Checkout** w lewej nawigacji
3. Kliknij **Customize** obok wybranego profilu checkout

**Opcja 2: Z Aftersell**

1. Kliknij przycisk **Open Shopify Checkout Editor** w prawym dolnym rogu strony edytora Checkout w Aftersell

💡 **Wskazówka:** opcja 1 daje Ci większą kontrolę nad tym, który profil checkout edytujesz. Zalecamy najpierw testowanie na wersji roboczej, zanim ją opublikujesz.

<img src="https://mintcdn.com/aftersell/1Y3gBpUfxv16VGSW/images/aftersell/checkout-widget-config-admin-settings-link.gif?s=a182cd42cf41d7b53e5e5765afeb65d9" alt="Strona główna panelu administracyjnego Shopify z wyróżnionym linkiem Settings do otwarcia edytora checkout" width="1844" height="1080" data-path="images/aftersell/checkout-widget-config-admin-settings-link.gif" />

***

<div id="step-3-add-the-app-block-to-your-checkout">
  ## Krok 3: Dodaj blok aplikacji do checkoutu
</div>

1. W edytorze Shopify Checkout kliknij **Add app block**
2. Wybierz odpowiedni widżet Aftersell z listy dostępnych widżetów
3. Wybierz właściwe rozmieszczenie dla widżetu (zobacz [Dostępne rozmieszczenia](#available-placements) poniżej)
4. Jeśli chcesz, aby widżety wyświetlały się w checkout Shop Pay, zaznacz opcję [**Include app block in Shop Pay**](/pl/aftersell/show_checkout_widgets_in_shop_pay)
5. Kliknij **Save** w prawym górnym rogu

<img src="https://mintcdn.com/aftersell/1Y3gBpUfxv16VGSW/images/aftersell/checkout-widget-install-add-app-block-button.png?fit=max&auto=format&n=1Y3gBpUfxv16VGSW&q=85&s=f6ba0d6ab535b750f8487c408e99ef69" alt="Edytor Shopify Checkout ze strzałką wskazującą przycisk Add block w pasku bocznym" width="3486" height="1964" data-path="images/aftersell/checkout-widget-install-add-app-block-button.png" />

***

<div id="step-4-position-your-widget">
  ## Krok 4: Umieść widżet
</div>

1. Przeciągnij i upuść blok aplikacji w wybranym miejscu w obrębie wybranego obszaru rozmieszczenia
2. Kliknij **Save** w prawym górnym rogu

<img src="https://mintcdn.com/aftersell/1Y3gBpUfxv16VGSW/images/aftersell/checkout-widget-install-drag-app-block.gif?s=7d17314d5e47e74b202e18baf3867e7a" alt="Lista bloków edytora Shopify Checkout obok podglądu checkoutu na żywo z widżetami Aftersell" width="1916" height="1080" data-path="images/aftersell/checkout-widget-install-drag-app-block.gif" />

***

<div id="widget-types-and-configuration">
  ## Typy widżetów i konfiguracja
</div>

<div id="placements">
  ## Rozmieszczenia
</div>

Rozmieszczenia tworzy się w edytorze Checkout w Aftersell i pozwalają one uruchamiać wiele widżetów tego samego typu na tej samej stronie checkout.

Na przykład, jeśli chcesz wyświetlić dwie oferty upsell na tej samej stronie, każda musi być przypisana do innego rozmieszczenia.

<div id="available-placements">
  ### Dostępne rozmieszczenia
</div>

* **Default placement**: podstawowe rozmieszczenie. Każdy typ widżetu zaczyna tutaj.
* **Additional placement 1**: drugie miejsce rozmieszczenia do wyświetlenia kolejnego widżetu tego samego typu na tej samej stronie.
* **Additional placement 2**: trzecie miejsce rozmieszczenia zapewniające dalsze rozdzielenie.

Możesz też tworzyć nowe rozmieszczenia bezpośrednio z listy rozwijanej rozmieszczeń w Aftersell, wybierając **+ Add new placement**.

<img src="https://mintcdn.com/aftersell/1Y3gBpUfxv16VGSW/images/aftersell/checkout-widget-config-placement-dropdown.gif?s=e43a141a2b6db37cb17ed0fcb1e2f8ef" alt="Edytor Checkout Aftersell pokazujący listę rozwijaną rozmieszczeń nad listą Upsells i podglądem" width="1912" height="1080" data-path="images/aftersell/checkout-widget-config-placement-dropdown.gif" />

***

<div id="when-to-use-multiple-placements">
  ### Kiedy używać wielu rozmieszczeń
</div>

Używaj wielu rozmieszczeń, gdy chcesz:

* Wyświetlić więcej niż jeden widżet tego samego typu na jednej stronie checkout
* Pokazywać widżety w różnych sekcjach strony
* Kierować różne oferty do różnych odbiorców
* Uruchamiać widżety o podobnych lub nakładających się wyzwalaczach

Aftersell używa systemu priorytetów. Nie możesz uruchamiać wielu widżetów o identycznych wyzwalaczach w ramach tego samego rozmieszczenia. Jeśli dwa widżety mają te same warunki wyzwalania w jednym rozmieszczeniu, wyświetli się tylko jeden, zgodnie z priorytetem.

Aby używać podobnych wyzwalaczy, przypisz każdy widżet do innego rozmieszczenia, aby mogły działać niezależnie i bez konfliktów.

***

<div id="matching-placements-in-the-shopify-checkout-editor">
  ## Dopasowywanie rozmieszczeń w edytorze Shopify Checkout
</div>

Każde rozmieszczenie w Aftersell odpowiada osobnemu blokowi aplikacji w edytorze Shopify Checkout. Rozmieszczenie wybrane w Shopify musi odpowiadać rozmieszczeniu ustawionemu w Aftersell.

Na przykład, jeśli widżet jest przypisany do **Additional placement 1** w Aftersell, blok aplikacji w Shopify również musi być ustawiony na **Additional placement 1**.

Jeśli rozmieszczenia nie pasują do siebie, widżet może się nie pojawić lub wyświetlić w złym miejscu.

**Ważne:** niedopasowanie rozmieszczenia to jeden z najczęstszych powodów, dla których widżet się nie wyświetla. Jeśli widżet się nie pojawia, przed dalszym rozwiązywaniem problemów potwierdź, że rozmieszczenie jest zgodne zarówno w Aftersell, jak i w Shopify.

<img src="https://mintcdn.com/aftersell/1Y3gBpUfxv16VGSW/images/aftersell/checkout-widget-config-block-placement-dropdown.gif?s=b9fc5f328cbf3bf04a63cfbdde505cb4" alt="Ustawienia bloku Upsell Widget w edytorze Shopify Checkout z listą rozwijaną Placement ustawioną na dodatkowe rozmieszczenie" width="2192" height="1080" data-path="images/aftersell/checkout-widget-config-block-placement-dropdown.gif" />

***

<div id="upsells">
  ### Upsells
</div>

Oferuj klientom produkty podczas checkoutu, aby zwiększyć średnią wartość zamówienia (AOV).

**Opcje konfiguracji:**

**Tryby widżetu:**

* **Single Product Upsell:** wyświetlanie jednego produktu z przyciskiem Add to Cart
* **Multi-Product Upsell:** pokazywanie wielu produktów w układzie stosu lub karuzeli, umożliwiając klientom zaakceptowanie wielu ofert
* **Checkmark Upsell:** wyświetlanie pojedynczego produktu z polem wyboru zamiast przycisku Add to Cart (idealne dla tanich dodatków, np. ochrony przesyłki)

**Metody wyboru produktów:**

* **Specific Products:** ręczny wybór poszczególnych produktów do upsellu
* **Collection:** wybierz kolekcję i wyświetlaj do 5 losowych produktów (produkty już w koszyku są automatycznie wykluczane)
* **Automatic upsell(s):** automatyczne rekomendowanie produktów na podstawie zawartości koszyka
* **Most Expensive Product:** automatyczny upsell najdroższego produktu z koszyka
* **Spend threshold:** rekomendowanie produktów, które pomagają klientom osiągnąć progi nagród (opcja dostępna dopiero po włączeniu **Show rewards bar** na tym samym widżecie upsell)
* **Strategy:** dynamiczny wybór produktu z wykorzystaniem targetowania opartego na regułach. Widoczne tylko w sklepach z włączonymi [Strategies](/pl/aftersell/strategies_overview)

**Dodatkowe funkcje:**

* Dodawanie rabatów bezpośrednio w widżecie
* Blokowanie planów subskrypcyjnych do konkretnych opcji
* Wyświetlanie gwiazdek recenzji produktów (wymaga zgodnej aplikacji recenzji)
* Ustawienie maksymalnej liczby zaakceptowanych ofert na widżet (tylko typy Single i Multi upsell)

[Dowiedz się więcej o widżetach upsell](/pl/aftersell/checkout_widget_types#upsells)

***

<div id="cart-controls">
  ### Cart Controls
</div>

Pozwól klientom modyfikować koszyk bezpośrednio na stronie checkout.

**Dostępne kontrolki:**

* **Variant selector:** zmiana na inny dostępny wariant
* **Quantity selector:** zmiana ilości produktów
* **Remove item:** Show Remove Item Button usuwa produkty upsell z koszyka. Powiązane ustawienie **Allow Removal of Non-Upsell Products** (domyślnie wyłączone) rozszerza usuwanie na wszystko w koszyku
* **Subscription selector:** zmiana częstotliwości subskrypcji
* **Subscription upgrade:** zmiana zakupów jednorazowych na subskrypcje
* **Custom text:** dodanie niestandardowego tekstu pod pozycjami zamówienia

**Targetowanie produktów:**

* Zastosuj do wszystkich produktów w koszyku
* Zastosuj tylko do wybranych produktów
* Zastosuj do wszystkich produktów z wyjątkiem wybranych

**Dodatkowe funkcje:**

* Wyświetlanie gwiazdek recenzji dla produktów w koszyku

[Dowiedz się więcej o kontrolkach koszyka](/pl/aftersell/checkout_widget_types#cart-controls)

***

<div id="rewards">
  ### Rewards
</div>

Wyświetlaj pasek postępu pokazujący klientom, jak blisko są zdobycia nagrody.

**Opcje konfiguracji:**

* Podstawa nagrody: **Cart total** lub **Item count**
* Podstawa kwoty (dla Cart total): **Order total (includes shipping and tax)**, **Subtotal (before discounts)** lub **Subtotal after discounts (excludes tax and shipping)**
* Komunikat i styl nagrody
* Kolory i wygląd paska postępu

**Najlepsze praktyki:**

* Łącz z widżetami upsell, aby pomóc klientom osiągnąć progi nagród
* Używaj typu produktu spend threshold w upsellach, aby automatycznie rekomendować produkty domykające lukę
* Twórz nagrody w Shopify za pomocą Automatic Discounts (dla nagród rabatowych) lub Shipping Rules (dla darmowej wysyłki)
* Używaj **Subtotal after discounts (excludes tax and shipping)** jako podstawy kwoty przy oferowaniu darmowej wysyłki, aby pasek odpowiadał ocenie progu przez Shopify, gdy stosowane są kody rabatowe

[Dowiedz się więcej o nagrodach](/pl/aftersell/checkout_widget_types#rewards)

***

<div id="trust-badges">
  ### Trust Badges
</div>

Buduj zaufanie za pomocą niestandardowych ikon i tekstu, aby zwiększyć współczynniki konwersji w checkout.

**Opcje konfiguracji:**

* Układ znaczków: pionowy stos lub układ poziomy
* Niestandardowe ikony i tekst dla każdego znaczka
* Opcje stylizacji i odstępów

**Najlepsze praktyki:**

* Podkreślaj funkcje bezpieczeństwa (bezpieczny checkout, szyfrowanie SSL)
* Prezentuj gwarancje (gwarancja zwrotu pieniędzy, darmowe zwroty)
* Pokazuj korzyści wysyłkowe (darmowa wysyłka, szybka dostawa)

[Dowiedz się więcej o znaczkach zaufania](/pl/aftersell/checkout_widget_types#trust-badges)

***

<div id="testimonials">
  ### Testimonials
</div>

Wyświetlaj opinie klientów bezpośrednio w checkout, aby budować zaufanie.

**Opcje konfiguracji:**

* **Flex Testimonials (zalecane):** automatycznie pobiera prawdziwe recenzje z Twojej aplikacji recenzji (Judge.me, Klaviyo, Okendo lub Yotpo)
* Tryb wyboru: Manual (wybór konkretnych recenzji) lub Dynamic (automatyczne pobieranie recenzji na podstawie zawartości koszyka)
* Typ wyświetlania: pozioma karuzela lub pionowy stos
* Filtr minimalnej oceny

**Wymagania konfiguracji:**

* Skonfiguruj dane dostępowe aplikacji recenzji w Settings > Product Reviews
* Recenzje synchronizują się automatycznie w ciągu 24 godzin, a następnie co tydzień

[Dowiedz się więcej o opiniach](/pl/aftersell/checkout_widget_types#testimonials)

***

<div id="notes">
  ### Notes
</div>

Pozwól klientom dodawać notatki do zamówienia.

**Opcje konfiguracji:**

* Notatki ręczne: pole tekstowe do wpisania przez klienta
* Notatki predefiniowane: pola wyboru dla opcji takich jak pakowanie na prezent czy eko-opakowanie

[Dowiedz się więcej o notatkach](/pl/aftersell/checkout_widget_types#notes)

***

<div id="images">
  ### Images
</div>

Przesyłaj i wyświetlaj niestandardowe obrazy w checkoucie.

**Opcje konfiguracji:**

* Przesyłanie obrazu
* Suwak regulacji szerokości
* Brak wymagania minimalnego rozmiaru

[Dowiedz się więcej o obrazach](/pl/aftersell/checkout_widget_types#images)

***

<div id="text">
  ### Text
</div>

Wstaw baner z niestandardowym tekstem w checkoucie.

**Opcje konfiguracji:**

* **Container Style:** **Plain Text** (domyślne) lub **Badge**. Kolory banera poniżej pojawiają się dopiero po wybraniu Badge
* **Banner Type** (tylko Badge):
  * **Info (Blue):** niebieskie tło z ikoną informacji
  * **Success (Green):** zielone tło z ikoną znacznika
  * **Warning (Yellow):** żółte tło z ikoną trójkąta ostrzegawczego
  * **Critical (Red):** czerwone tło z ikoną wykrzyknika
* Rozmiar tekstu w polu **Body** (Small lub Base) — pole Heading nie ma kontroli rozmiaru
* Wyrównanie w polach Heading i Body
* Odstępy: None, Extra Tight, Tight, Base, Loose lub Extra Loose

[Dowiedz się więcej o tekście](/pl/aftersell/checkout_widget_types#text)

***

<div id="troubleshooting">
  ## Rozwiązywanie problemów
</div>

<div id="widgets-not-displaying">
  ### Widżety się nie wyświetlają
</div>

Jeśli widżety nie pokazują się po konfiguracji:

1. Sprawdź, czy widżet jest włączony w panelu administracyjnym Aftersell
2. Upewnij się, że blok aplikacji jest dodany w edytorze Shopify Checkout
3. Potwierdź, że blok aplikacji jest zapisany w edytorze Shopify Checkout
4. Sprawdź, czy wybrano właściwe rozmieszczenie. Dodając blok aplikacji w edytorze Shopify Checkout, musisz wybrać pasujące rozmieszczenie, np. Default placement, Additional placement 1 lub Additional placement 2. Jeśli wybrano złe rozmieszczenie, widżet może się nie pojawić lub wyświetlić w złym miejscu. Usuń blok aplikacji i dodaj go ponownie, upewniając się, że wybrano zamierzone rozmieszczenie.
5. Dla Shop Pay: sprawdź, czy zaznaczono „Include app block in Shop Pay”
6. Wyczyść pamięć podręczną przeglądarki lub spróbuj trybu incognito
7. Poczekaj kilka minut na propagację zmian

<div id="shop-pay-widgets-not-showing">
  ### Widżety Shop Pay się nie pokazują
</div>

Aby wyświetlać widżety w checkout Shop Pay:

1. Otwórz widżet w edytorze Shopify Checkout
2. Zaznacz opcję **Include app block in Shop Pay** w sekcji Checkout behaviour
3. Zapisz zmiany

<img src="https://mintcdn.com/aftersell/1Y3gBpUfxv16VGSW/images/aftersell/checkout-widget-config-editor-sidebar-app-block.gif?s=63de90b2b7e5807806e2390316de688d" alt="Pasek boczny edytora Shopify Checkout pokazujący blok aplikacji Aftersell Upsell Widget w sekcji Main" width="1416" height="1080" data-path="images/aftersell/checkout-widget-config-editor-sidebar-app-block.gif" />

[Dowiedz się więcej o widżetach Shop Pay](/pl/aftersell/show_checkout_widgets_in_shop_pay)

***

<div id="next-steps">
  ## Następne kroki
</div>

* [Poznaj wyzwalacze checkout](/pl/aftersell/checkout_triggers), aby wyświetlać widżety warunkowo
* [Skonfiguruj testy A/B checkout](/pl/aftersell/checkout_a_b_testing), aby optymalizować rozmieszczenia
* [Skonfiguruj branding checkout](/pl/aftersell/checkout_branding_settings), aby dopasować go do wyglądu sklepu
* [Poznaj zaawansowane strategie upsell](/pl/aftersell/best_practices), aby maksymalizować AOV