Skip to main content
Układ twojego koszyka to stos bloków: konfigurowalnych elementów, które dodajesz, przestawiasz, stylizujesz i dostosowujesz w edytorze koszyka. To, które bloki dodasz i w jakiej kolejności, tworzy koszyk widziany przez kupujących. O tym, jak bloki wpisują się w stany i sekcje, przeczytasz w Jak działają koszyki?.

Bloki i sub-bloki

Istnieją dwa rodzaje bloków:
  • Bloki znajdują się bezpośrednio w koszyku, w jednej z trzech sekcji: Header, Body lub Footer. Każda sekcja oferuje inny zestaw bloków.
  • Sub-bloki są zagnieżdżone wewnątrz innego bloku. Obecnie tylko Cart items obsługuje sub-bloki: wiersz Product (sam wiersz pozycji), Subscription upgrade oraz Custom code.

Dodawanie, przestawianie i usuwanie bloków

  • Dodawaj bloki przez selektor Add block. Blok jest wyszarzony, jeśli nie może trafić tam, gdzie go dodajesz, lub jeśli osiągnięto jego limit (selektor pokazuje odznakę count/max).
  • Zmieniaj kolejność, przeciągając blok w obrębie jego sekcji.
  • Usuwaj ikoną kosza — z wyjątkiem bloków zablokowanych (poniżej).
  • Pokazuj/ukrywaj większość bloków przełącznikiem oka, który ukrywa blok przed kupującymi bez jego usuwania. Kilku bloków strukturalnych nie można ukryć: Cart items, Checkout button i wiersza Product.

Bloki zablokowane

Niektóre bloki można przestawiać, ale nie usuwać, dzięki czemu podstawowe działanie koszyka (na przykład przejście do checkoutu) nie może zostać usunięte przez przypadek:
  • Cart items
  • Checkout button

Bloki domyślne

Nowe koszyki zaczynają z działającym domyślnym układem:
  • Wypełniony koszyk: Header, Banner, Cart items, Summary, Checkout button
  • Pusty koszyk: Header, blok Empty cart
Stan pustego koszyka to cały pusty układ. Blok Empty cart to jeden blok wewnątrz niego. Różnicę znajdziesz w Jak działają koszyki?.

Ile bloków każdego typu możesz dodać

Limity liczone są per stan koszyka, nie per koszyk. Wypełniony koszyk i pusty koszyk mają osobne limity, więc koszyk może mieć trzy Bannery w układzie wypełnionym i trzy kolejne w układzie pustym. Większość bloków jest ograniczona do jednego na stan. Wyjątki:

Content, Design i Code

Każdy blok konfiguruje się przez maksymalnie trzy powierzchnie w edytorze:
  • Content: ustawienia bloku (tekst, wybór produktów, progi itd.). Blok Custom code to jedyny wyjątek: nie ma panelu Content, ponieważ blok jest kodem.
  • Design: stylizacja per blok, która nakłada się na twoje globalne Ustawienia designu. Ma ją każdy blok poza Custom code, który w ogóle nie ma panelu ustawień.
  • Code: nadpisanie wbudowanego renderowania bloku szablonem niestandardowym. Obsługuje to większość bloków; kilka nie.

Pokazywanie lub ukrywanie według rynku, kraju lub waluty

Niektóre bloki mogą pokazywać różne ustawienia lub całkowicie się ukrywać w zależności od tego, kim jest kupujący. To coś innego niż przełącznik oka w pasku bocznym, który włącza lub wyłącza blok dla wszystkich. Obsługiwane typy warunków dziś: rynek Shopify, kraj klienta i waluta klienta (każdy z In lub Not in). Suma koszyka i zawartość koszyka nie są typami warunków. Użyj progów poziomów w Rewards do progresu wydatków/ilości albo Cart SDK, gdy potrzebujesz reguły, której edytor nie potrafi wyrazić. Warunki to uporządkowana lista: wygrywa pierwszy pasujący warunek. Umieszczaj reguły szczegółowe nad regułą zbiorczą All buyers. Jeśli nic nie pasuje, blok nie renderuje niczego dla tego kupującego. W edytorze dziś pełny interfejs Conditions dostępny jest w bloku Rewards: różne zestawy poziomów per rynek, kraj lub waluta. Inne bloki albo używają jednej konfiguracji „dla wszystkich kupujących”, albo jeszcze nie uczestniczą w tym systemie. Podgląd edytora nie ocenia rzeczywistego kupującego. Wybierz warunek w panelu, aby podejrzeć ten wariant.

Wszystkie bloki

Struktura
  • Header: tytuł, liczba pozycji, logo i przycisk zamknięcia, przypięte do góry.
  • Cart items: pozycje dodane przez klientów do koszyka; powtarza się per linia.
  • Subscription upgrade: sub-blok oferujący konwersję linii na subskrypcję.
  • Summary: sumy, oszczędności i zastosowane rabaty.
  • Checkout button: główne wezwanie do działania prowadzące do checkoutu.
  • Empty cart: treść pokazywana, gdy koszyk jest pusty.
  • Express payments: przyciski przyspieszonego checkoutu (Shop Pay, PayPal itd.) wewnątrz koszyka.
Merchandising
  • Upsells: rekomendacje produktów dobierane strategią.
  • Product add-on: pojedynczy konkretny produkt oferowany jako dodatek.
  • Rewards: progowe nagrody, takie jak darmowa wysyłka lub prezenty.
  • Shipping protection: opcjonalny dodatek ochrony przesyłki.
Dane od kupującego
  • Discount code: pole do zastosowania kodu rabatowego.
  • Notes: pole notatek do zamówienia.
Treść
  • Banner: baner z komunikatem, z opcjonalnym licznikiem odliczającym.
  • Image: pojedynczy obraz lub hostowany preset, np. ikony płatności.
  • Custom code: niestandardowy HTML lub React w dowolnym miejscu koszyka.
Rozszerzanie
  • Custom templates: nadpisanie sposobu renderowania dowolnego bloku z jego karty Code.

Bloki dostępne w poszczególnych sekcjach

Każda sekcja ma inny zestaw dostępnych bloków. Dzięki temu układ pozostaje przejrzysty i uporządkowany. Niektóre z tych bloków są przypisane do stanu (na przykład Empty cart tylko w stanie pustym). Zobacz Jak działają koszyki?.

Błędy walidacji bloków

Jeśli ustawienia bloku zawierają nieprawidłową wartość, obok nazwy tego bloku w pasku bocznym pojawia się mała czerwona kropka. Kropka pozostaje, dopóki nie naprawisz problemu. Nie jest to powiadomienie, które można odrzucić. Dopóki jakikolwiek blok ma błąd, zapisywanie jest zablokowane. Przycisk Save pozostaje klikalny, ale jego wybranie pokazuje toast z błędem („Fix the errors in your cart blocks before saving”) i przeskakuje do pierwszego bloku z problemem, otwierając jego ustawienia, abyś mógł poprawić podświetlone pole. Publish dodatkowo wymaga braku niezapisanych zmian, więc pozostaje niedostępny do czasu udanego, czystego zapisu. Po poprawieniu nieprawidłowego pola kropka znika sama, a zapisywanie przebiega normalnie.
Ukryte bloki wciąż podlegają walidacji. Ukryty blok może zawierać nieprawidłowe ustawienie, pokazywać kropkę błędu i blokować zapisywanie dokładnie jak widoczny — więc jeśli zapisywanie jest zablokowane, a każdy widoczny blok wygląda dobrze, sprawdź ukryte bloki.