> ## 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 przyklejonego przycisku koszyka na stronie głównej

> Ten artykuł wyjaśnia, jak użyć JavaScriptu i CSS, aby ukryć pływający przycisk koszyka na stronie głównej sklepu.

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

Jeśli zależy Ci na czystszym pierwszym wrażeniu lub układ Twojej strony głównej koliduje z przyklejonym przyciskiem koszyka, możesz ukryć ten przycisk wyłącznie na stronie głównej za pomocą prostego fragmentu kodu.

Ta konfiguracja sprawdza bieżącą stronę klienta i usuwa przyklejony przycisk koszyka, jeśli klient znajduje się na stronie głównej.

***

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

* Aby uniknąć wizualnego bałaganu na stronie głównej
* Gdy używasz niestandardowej sekcji hero lub układu, który nachodzi na przyklejony koszyk
* Aby przycisk koszyka był widoczny tylko na stronach produktów lub kolekcji

***

<div id="step-1-add-the-script">
  ## Krok 1: dodaj skrypt
</div>

1. Przejdź do **Upcart > Cart Editor > Settings > Custom HTML**
2. Z listy rozwijanej **HTML Location** wybierz **Scripts (Before Load)**
3. Wklej poniższy JavaScript:

```
<script>  
  var stickyCartButton = document.querySelector("#upCartStickyButton");  
  
  if (  
    stickyCartButton &&  
    (document.location.pathname === "/" + Shopify.locale ||  
     document.location.pathname === "/")  
  ) {  
    stickyCartButton.classList.add("hide-sticky-cart-button");  
  }  
</script>
```

Ten skrypt sprawdza ścieżkę bieżącej strony i dodaje klasę ukrywającą przyklejony przycisk, jeśli klient znajduje się na stronie głównej.

***

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

1. Przejdź do **Upcart > Sticky Cart > Custom CSS (pamiętaj, że chodzi o Sticky Cart, a nie Cart Editor)**
2. Wklej poniższy CSS:

```
.hide-sticky-cart-button {     
  display: none;   
}
```

***

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

* Przyklejony przycisk koszyka będzie ukryty, gdy klient odwiedzi stronę główną (`/` lub `/[locale]`)
* Przycisk pozostaje widoczny na wszystkich pozostałych stronach