Skip to main content
⚠️ Ważna informacja Poniższy snippet szablonu dotyczy obu wersji modułów koszyka Upcart — sprawia, że Shopify renderuje przyciski przyspieszonego checkout na stronie, czego Upcart potrzebuje niezależnie od wersji modułu. Poniższy selektor .additional-checkout-buttons to własna klasa Shopify na kontenerze przyspieszonego checkout, a nie klasa modułu Upcart, więc jest taka sama w obu wersjach koszyka.

Przegląd

Czasami przyciski ekspresowego checkout nie są klikalne lub nie pojawiają się w Upcart. To częsty problem spowodowany tym, jak Shopify kontroluje renderowanie przycisków płatności ekspresowych w szablonach. Ten przewodnik wyjaśnia, dlaczego tak się dzieje i co możesz zrobić, aby to naprawić.

Wymagana konfiguracja dla nowego modułu

⚠️ Ważne: Te kroki dotyczą nowego modułu Express Payments w Upcart, a nie wersji starszej. Aby przyciski ekspresowego checkout działały poprawnie w Upcart, musisz dodać mały fragment kodu do swojego szablonu Shopify. Bez tego snippetu Shopify nie załaduje poprawnie przycisków płatności w koszyku wysuwanym. Przed wprowadzeniem tych zmian zweryfikuj, że odpowiednie metody płatności (np. Shop Pay, PayPal, Apple Pay, Google Pay) są włączone w ustawieniach konta w panelu administracyjnym Shopify. Bez włączenia tych metod przyciski nie będą widoczne. Dodatkowo upewnij się, że snippet jest umieszczony bezpośrednio pod otwierającym tagiem <body> w pliku szablonu (np. <body class="...">). Jeśli zostanie umieszczony nieprawidłowo, na przykład po zamykającym tagu </body>, przyciski ekspresowego checkout mogą nie działać poprawnie.

Jak to naprawić

  1. Przejdź do panelu administracyjnego Shopify.
  2. Przejdź do Online Store > Themes > Edit Code.
  3. Otwórz layout/theme.liquid, znajdź linię <body> i dodaj poniższy snippet w nowej linii bezpośrednio pod nią. Musi się tam znaleźć — nie w cart-drawer.liquid ani nigdzie indziej — ponieważ przyciski muszą istnieć na każdej stronie, na której koszyk może się otworzyć.
  1. Zapisz zmiany i odśwież swój sklep.
  2. Otwórz ponownie koszyk wysuwany, aby zweryfikować, że przyciski ekspresowego checkout (takie jak Shop Pay, PayPal, Apple Pay czy Google Pay) teraz się pojawiają i są klikalne.
Zapoznaj się z przewodnikiem po module Express Payments, aby uzyskać pełne instrukcje konfiguracji.

Dlaczego tak się dzieje

Przyciski płatności ekspresowych są w pełni zarządzane przez Shopify, a nie Upcart. Oznacza to, że:
  • Upcart nie renderuje własnych przycisków. Klonuje przyciski przyspieszonego checkout Shopify ze strony do koszyka wysuwanego, dlatego muszą one w ogóle być obecne na stronie — to właśnie gwarantuje powyższy snippet szablonu.
  • Apple Pay pokaże się tylko na urządzeniach Apple z skonfigurowanym Apple Pay.
  • Upcart nie kontroluje, które przyciski ekspresowe się pojawiają, ponieważ zawartość i funkcjonalność są obsługiwane przez Shopify.
🎨 Uwaga:
Przyciski w Upcart działają jako wizualne kontenery, podczas gdy Shopify kontroluje ich wyświetlanie i zachowanie. Upcart nie może modyfikować ich wyglądu ani działania.

Typowe problemy i rozwiązania

1. Przyciski nie są renderowane na stronie

To najczęstsza przyczyna. Upcart klonuje przyciski Shopify ze strony, więc jeśli strona ich nie renderuje, nie ma czego klonować i koszyk pokazuje puste miejsce. Co zrobić:
  • Dodaj snippet szablonu z sekcji Jak to naprawić powyżej, bezpośrednio pod linią <body> w layout/theme.liquid.
Nie usuwaj własnych przycisków ekspresowych szablonu, aby „uniknąć konfliktu”. Upcart zależy od ich obecności. Usunięcie ich z szablonu lub wyłączenie w ustawieniach szablonu usuwa źródło, z którego Upcart klonuje — co pogarsza ten problem, a nie go rozwiązuje.

3. CSS blokuje przyciski

Niektóre szablony domyślnie ukrywają przyciski ekspresowe za pomocą CSS. Na przykład:
Co zrobić:
  • Przejrzyj CSS swojego szablonu.
  • Poproś dewelopera szablonu, aby upewnił się, że żadne reguły CSS nie ukrywają ani nie wyłączają przycisków w koszyku Upcart.

4. Starsze ustawienia zakłócają działanie

Jeśli używałeś starszej wersji modułu Express Payments, zapisane ustawienia mogą kolidować z nową konfiguracją. Co zrobić:
  • Otwórz stary moduł Express Payments (jeśli nadal jest widoczny).
  • Odznacz wszelkie wcześniejsze opcje i zapisz.
  • Przetestuj ponownie, używając nowego modułu.

Nadal masz problemy?

Wyłącz Shadow DOM w Upcart

W niektórych przypadkach przyciski płatności ekspresowych mogą nie ładować się lub nie aktualizować, ponieważ w Upcart włączony jest Shadow DOM. Czym jest Shadow DOM?
Shadow DOM izoluje Upcart od reszty kodu Twojego sklepu, aby poprawić stabilność. Jednak w rzadkich przypadkach ta separacja może uniemożliwić poprawne aktualizowanie się przycisków ekspresowych Shopify.
Jak wyłączyć Shadow DOM:
  1. Przejdź do Upcart > Cart Editor > Settings > Cart settings, następnie rozwiń Advanced Settings.
  2. Odznacz Render Cart in Shadow DOM.
  3. Zapisz i przetestuj ponownie.
⚠️ Ważne:
Zawsze testuj swój koszyk po wyłączeniu Shadow DOM, ponieważ może to wpłynąć na to, jak inne aplikacje lub elementy szablonu wchodzą w interakcję z Upcart.
💡 Uwaga: Wyłączenie Shadow DOM może rozwiązać ten problem, ale może wprowadzić konflikty CSS z Twoim szablonem. Zobacz dokument o ustawieniu Shadow DOM, aby poznać pełen kompromis.

Potrzebujesz dalszej pomocy?

Jeśli problem nadal występuje po wykonaniu tych kroków:
  • Skontaktuj się z deweloperem szablonu, aby pomógł usunąć konfliktujący kod lub ustawienia.
  • Możesz też skontaktować się z ekspertem Shopify w sprawie zaawansowanych edycji szablonu lub pomocy w integracji.

Materiały źródłowe

  • Shopify Help – Accelerated Checkouts
  • Shopify Dev Docs – Express Payment Buttons