> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Ukrywanie określonych elementów koszyka za pomocą identyfikatorów produktów

> Użyj identyfikatorów produktów, aby warunkowo ukryć pasek nagród lub inne elementy koszyka w zależności od jego zawartości.

⚠️ **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.](/pl/upcart/upcart_v20_migration_guide)

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.

<div id="overview">
  # Omówienie
</div>

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.

***

<div id="when-to-use-this">
  ## Kiedy tego użyć
</div>

* 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.

***

<div id="step-1-find-the-product-ids">
  ## Krok 1: znajdź identyfikatory produktów
</div>

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:**

```
/products/1234567890 → 1234567890
```

Użyjesz tych identyfikatorów w tablicy JavaScript, która steruje widocznością.

***

<div id="step-2-add-custom-html">
  ## Krok 2: dodaj niestandardowy HTML
</div>

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`)

```
<script>  
  window.upcartSubscribeCartLoaded((event) => {  
    const items = event.cart.items;  
    const productIDsToExclude = [  
      6958755512411,  
      6958755610712,  
      7736708759774  
    ];  
  
    let cartContainsExcludedItem = false;  
  
    items.forEach((item) => {  
      productIDsToExclude.forEach((id) => {  
        if (item.productId === id) {  
          cartContainsExcludedItem = true;  
        }  
      });  
    });  
  
    const targetElement = window.upcartDocumentOrShadowRoot.querySelector(".YOUR-CLASS-HERE");  
    if (targetElement) {  
      targetElement.style.display = cartContainsExcludedItem ? "none" : "block";  
    }  
  });  
</script>
```

<Note>
  **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`.
</Note>

***

<div id="step-3-optional-fallback-css">
  ## Krok 3: opcjonalny zapasowy CSS
</div>

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**:

```
.YOUR-CLASS-HERE {   display: none; }
```

**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.

***

<div id="final-result">
  ## Efekt końcowy
</div>

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

***

<div id="still-need-help">
  ## Nadal potrzebujesz pomocy?
</div>

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](https://www.shopify.com/partners/directory)