Skip to main content
Blok Checkout button to główne wezwanie do działania w stopce koszyka, które prowadzi kupujących do checkoutu, dając im wyraźną, widoczną ścieżkę z koszyka do finalizacji zakupu. To blok wymagany.

Działanie

  • Przycisk ustala zlokalizowany, poprawny dla rynku URL checkoutu, dzięki czemu kupujący trafiają do checkoutu właściwego rynku. Jeśli nie da się go ustalić, wraca do standardowego linku /checkout.
  • Z włączoną opcją Go to cart page instead of checkout przycisk linkuje zamiast tego do /cart.
  • Kliknięcie nawiguje przez JavaScript, więc własna obsługa koszyka w motywie nie może go przechwycić, przy zachowaniu intencji otwarcia w nowej karcie (Cmd/Ctrl-klik, klik środkowym przyciskiem).
  • Kliknięcie emituje zdarzenie SDK checkout, które możesz subskrybować.

Ustawienia

Umiejscowienie i limity

  • Region: dół.
  • Maksimum: 1 na stan koszyka.
  • Stan: tylko wypełniony koszyk.
  • Zablokowany i dodawany domyślnie. Przycisku Checkout nie można usunąć ani ukryć, można tylko zmienić jego pozycję w stopce.

Szablon niestandardowy

Obsługuje szablon niestandardowy z karty Code, który zastępuje wbudowaną strukturę tego bloku twoim JSX. Oto propsy, które otrzymuje.
Niestandardowy przycisk checkoutu traci śledzenie checkoutu. Wbudowany przycisk podpina handler kliknięcia, który emituje zdarzenie SDK checkout i rejestruje konwersję dla analityki koszyka. Ten handler nie jest przekazywany do szablonów niestandardowych, więc nawigacja przez samo href pomija oba.Jeśli potrzebujesz tego zdarzenia, wyemituj je samodzielnie z onClick przed nawigacją. Raportowania atrybucji i tak nie da się w ten sposób odzyskać, więc preferuj przestylizowanie wbudowanego przycisku przez ustawienia designu lub niestandardowy CSS, chyba że naprawdę potrzebujesz innej struktury.
Renderuj href bez zmian, nie ustawiając wartości domyślnej. <a> bez href jest nieaktywny, co jest poprawnym zachowaniem w edytorze.

Design

Stylizuj ten blok w sekcji Design w panelu ustawień. To nadpisania per blok, które nakładają się na twój globalny design i wracają do niego, gdy są puste. Czym są ustawienia designu? Dowiedz się więcej tutaj: Ustawienia designu.