Skip to main content
⚠️ Ważna informacja Ta personalizacja działa tylko z wersją 1 modułów koszyka Upcart. Jeśli niedawno zaktualizowano Twój koszyk do wersji 2, te personalizacje mogą nie działać. Musisz użyć nowych selektorów przewidzianych dla wersji 2, opisanych w przewodniku migracji. Jeśli Twoje personalizacje nie działają zgodnie z oczekiwaniami, możesz samodzielnie przywrócić koszyk do wersji 1: w Cart Editor użyj listy rozwijanej Cart version u góry lewego menu i wybierz V1.0 (Legacy). Lista rozwijana pojawia się, gdy każdy moduł w koszyku jest w wersji V2. Obecnie pracujemy nad nowymi szablonami personalizacji dla wersji 2 modułów — będą one dostępne wkrótce.

Omówienie

Ta personalizacja pozwala ukryć określone części koszyka, na przykład pasek nagród, jeśli w koszyku znajdują się określone produkty. Przydaje się, gdy chcesz uprościć wygląd koszyka dla wybranych SKU lub zapobiec wyświetlaniu określonych promocji obok wybranych pozycji. Ta konfiguracja wykorzystuje identyfikatory produktów, aby wykryć, które produkty znajdują się w koszyku, i ukrywa wybrany element w przypadku dopasowania. Logikę zastosujesz za pomocą niestandardowego HTML i CSS w edytorze Upcart.

Kiedy tego użyć

  • Ukryj pasek nagród, gdy w koszyku znajdują się produkty promocyjne
  • Ukryj niestandardowe bloki treści, odznaki zaufania lub sekcje upsell w zależności od typu produktu
  • Zapewnij bardziej przejrzysty lub dopasowany przebieg checkoutu dla określonych pozycji
To podejście wymaga podstawowej znajomości HTML i JavaScript.

Krok 1: znajdź identyfikatory produktów

  1. Przejdź do Shopify Admin > Products
  2. Kliknij produkt, który chcesz objąć regułą
  3. Skopiuj numeryczny identyfikator produktu z adresu URL po /products/
Przykład:
Użyjesz tych identyfikatorów w tablicy JavaScript, która steruje widocznością.

Krok 2: dodaj niestandardowy HTML

  1. Przejdź do Upcart > Cart Editor > Settings > Custom HTML
  2. Wklej poniższy kod w obu lokalizacjach HTML: Above announcements/rewards oraz On empty cart screen
  3. Zastąp wartości w productIDsToExclude swoimi identyfikatorami produktów
  4. Zaktualizuj .YOUR-CLASS-HERE, aby wskazywał element koszyka, który chcesz ukryć (na przykład: .upcart-rewards, .custom-message, .trust-badge)
Uwaga dotycząca starszej wersji: wywołania zwrotne window.upcartOnCartLoaded nadal działają, ale są przestarzałe i generują ostrzeżenia w konsoli. We wszystkich nowych skryptach używaj upcartSubscribeCartLoaded.

Krok 3: opcjonalny zapasowy CSS

Jeśli chcesz mieć pewność, że element będzie ukryty, zanim koszyk w pełni się załaduje, dodaj poniższy kod w sekcji Custom CSS:
Uwaga: może to tymczasowo ukryć element dla wszystkich użytkowników do czasu uruchomienia JavaScriptu, co może powodować migotanie. W większości przypadków lepiej polegać na metodzie JavaScript.

Efekt końcowy

Po skonfigurowaniu:
  • Wskazany element koszyka (na przykład pasek nagród) zostanie ukryty, jeśli koszyk zawiera jeden z określonych produktów
  • W pozostałych przypadkach element pozostaje widoczny
  • Możesz wykorzystać tę logikę ponownie, aby ukrywać lub pokazywać różne elementy na podstawie reguł związanych z konkretnymi produktami

Nadal potrzebujesz pomocy?

Przy bardziej złożonych personalizacjach zalecamy współpracę z ekspertem Shopify. Pomoże Ci on z HTML, CSS i JavaScriptem w Twoim cart drawer. Zobacz ekspertów Shopify