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

# Скрытие закреплённой кнопки корзины на главной странице

> В этой статье объясняется, как с помощью JavaScript и CSS скрыть плавающую кнопку корзины на главной странице вашего магазина.

<div id="overview">
  # Обзор
</div>

Если вы хотите более чистое первое впечатление или макет вашей главной страницы конфликтует с закреплённой кнопкой корзины, вы можете скрыть кнопку именно на главной странице с помощью простого фрагмента кода.

Эта настройка проверяет текущую страницу покупателя и убирает закреплённую кнопку корзины, если он находится на главной странице.

***

<div id="when-to-use-this">
  ## Когда это использовать
</div>

* Чтобы избежать визуальной перегруженности главной страницы
* При использовании пользовательской hero-секции или макета, который перекрывается закреплённой корзиной
* Чтобы кнопка корзины была сосредоточена на страницах товаров или коллекций

***

<div id="step-1-add-the-script">
  ## Шаг 1. Добавьте скрипт
</div>

1. Перейдите в **Upcart > Cart Editor > Settings > Custom HTML**
2. В выпадающем списке **HTML Location** выберите **Scripts (Before Load)**
3. Вставьте следующий 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>
```

Этот скрипт проверяет путь текущей страницы и применяет класс, скрывающий закреплённую кнопку, если покупатель находится на главной странице.

***

<div id="step-2-add-custom-css">
  ## Шаг 2. Добавьте пользовательский CSS
</div>

1. Перейдите в **Upcart > Sticky Cart > Custom CSS (обратите внимание: это Sticky Cart, а не Cart Editor)**
2. Вставьте следующий CSS:

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

***

<div id="final-result">
  ## Итоговый результат
</div>

* Закреплённая кнопка корзины будет скрыта, когда покупатель посещает главную страницу (`/` или `/[locale]`)
* На всех остальных страницах кнопка остаётся видимой