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

# Библиотека HTML-локаций Upcart

> Узнайте, где собственный HTML и JavaScript будут отображаться в корзине-шторке.

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

Upcart позволяет вставлять HTML или JavaScript в определённые места корзины с помощью редактора **Custom HTML**. Это даёт вам полный контроль над макетом, видимостью и условным контентом внутри корзины.

Используйте это руководство, чтобы понять, как ведёт себя каждая локация и где будет отображаться ваш контент.

<div id="available-html-locations">
  ## Доступные HTML-локации
</div>

<div id="above-announcementsrewards">
  #### **Above announcements/rewards**
</div>

Отображается непосредственно под заголовком корзины, перед всеми модулями.\
Используйте это для добавления сообщений на весь сайт, отметок или динамических баннеров.

<div id="below-headerannouncementsrewards">
  #### **Below header/announcements/rewards**
</div>

Отображается сразу после модулей объявлений и вознаграждений, непосредственно перед списком товаров.

<div id="between-each-line-item">
  #### **Between each line item**
</div>

Повторяет ваш HTML после каждого товара в корзине.\
Идеально для отображения оговорок или дополнительной информации о конкретных товарах.

<div id="below-cart-items">
  #### **Below cart items**
</div>

Отображается под списком товаров, после всех позиций корзины. Используйте это для сообщений, баннеров или собственного контента, который должен появляться под товарами, но над upsell-предложениями и дополнениями.

<div id="above-footeradd-ons">
  #### **Above footer/add-ons**
</div>

Появляется под списком товаров и upsell-предложениями, но над разделом дополнений.\
Отлично подходит для сообщений, подводящих к предложениям гарантии или защиты доставки.

<div id="above-checkout-button">
  #### **Above checkout button**
</div>

Отображается в области футера, непосредственно над кнопкой оформления заказа и промежуточной суммой.\
Часто используется для отображения разбивки цен, уведомлений о доставке или условий.

<div id="below-checkout-button">
  #### **Below checkout button**
</div>

Также в футере, располагается после кнопки оформления заказа и перед кнопками экспресс-оплаты. Дополнения отображаются в верхней части футера, значительно выше этого места.\
Полезно для второстепенных призывов к действию или юридических уведомлений.

<div id="bottom-of-cart">
  #### **Bottom of cart**
</div>

Отображается за пределами области футера в самом низу корзины-шторки.\
Не наследует цвет фона футера.

<div id="on-empty-cart-screen">
  #### **On empty cart screen**
</div>

Отображается только когда корзина пуста.\
Появляется непосредственно **под** сообщением «Your cart is empty» и над модулем рекомендаций — полезно для сопроводительной строки или ссылки на коллекцию.

<div id="scripts-before-load">
  #### **Scripts (Before Load)**
</div>

Невидимое размещение, используемое для выполнения JavaScript **перед** загрузкой корзины.\
Используйте его для определения переменных, задания условий или изменения поведения Upcart.

* Все размещения собственного HTML управляются в:\
  **Upcart > Cart Editor > Settings > Custom HTML**

<div id="visual-reference">
  ## Визуальный справочник
</div>

Для наглядного понимания того, где отображается каждая локация внутри корзины, обратитесь к размеченному макету ниже

<Frame>
  <img src="https://mintcdn.com/aftersell/uxKAdY-e0h16xa48/images/upcart/html-locations-labeled-cart-drawer.gif?s=fd801e149233b51066ee15010556c375" alt="Размеченная корзина-шторка Upcart, показывающая, где отображается каждая локация собственного HTML" width="700" height="1080" data-path="images/upcart/html-locations-labeled-cart-drawer.gif" />
</Frame>