.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
Wymagana konfiguracja dla nowego modułu
<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ć
- Przejdź do panelu administracyjnego Shopify.
- Przejdź do Online Store > Themes > Edit Code.
- 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 wcart-drawer.liquidani nigdzie indziej — ponieważ przyciski muszą istnieć na każdej stronie, na której koszyk może się otworzyć.
- Zapisz zmiany i odśwież swój sklep.
- 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.
Dlaczego tak się dzieje
- 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.
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
- Dodaj snippet szablonu z sekcji Jak to naprawić powyżej, bezpośrednio pod linią
<body>wlayout/theme.liquid.
Niektóre szablony domyślnie ukrywają przyciski ekspresowe za pomocą CSS. Na przykład:
- 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
- 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
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:
- Przejdź do Upcart > Cart Editor > Settings > Cart settings, następnie rozwiń Advanced Settings.
- Odznacz Render Cart in Shadow DOM.
- Zapisz i przetestuj ponownie.
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?
- 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