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

# Блок кнопки оформления заказа

> Блок Checkout button в Aftersell Cart: обязательная CTA-кнопка в футере, которая отправляет покупателей к оформлению заказа.

> Блок **Checkout button** — это основной призыв к действию в футере корзины, который ведёт покупателей к оформлению заказа, обеспечивая им понятный и заметный путь от корзины к checkout. Это обязательный блок.

<div id="behavior">
  ## Поведение
</div>

* Кнопка определяет **локализованный URL checkout с учётом рынка**, поэтому покупатели попадают на страницу оформления заказа своего рынка. Если его определить не удаётся, используется стандартная ссылка `/checkout`.
* При включённой опции **Go to cart page instead of checkout** кнопка ведёт на `/cart`.
* Клик выполняет навигацию через JavaScript, поэтому собственная обработка корзины темой не может её перехватить, при этом уважаются намерения открыть новую вкладку (Cmd/Ctrl-клик, клик средней кнопкой).
* Клик генерирует SDK-событие [`checkout`](/ru/aftersell/cart/sdk-events), на которое можно подписаться.

<div id="settings">
  ## Настройки
</div>

| Настройка                               | Что она контролирует                                                                       | По умолчанию                 |
| --------------------------------------- | ------------------------------------------------------------------------------------------ | ---------------------------- |
| **Button label**                        | Текстовая надпись, вводимая в текстовое поле. Поддерживает `{{total_price}}`.              | `Checkout • {{total_price}}` |
| **Go to cart page instead of checkout** | Отправляет покупателей на вашу страницу `/cart` вместо перехода сразу к оформлению заказа. | Выкл.                        |

<div id="placement-and-limits">
  ## Размещение и ограничения
</div>

* **Область:** низ.
* **Максимум:** 1 на состояние корзины.
* **Состояние:** только заполненная корзина.
* **Заблокирован и добавлен по умолчанию.** Кнопку Checkout нельзя удалить или скрыть, только переместить внутри футера.

<div id="custom-template">
  ## Пользовательский шаблон
</div>

Поддерживает [пользовательский шаблон](/ru/aftersell/cart/custom-templates) на вкладке Code, который заменяет встроенную разметку этого блока вашим JSX. Вот пропсы, которые он получает.

| Проп        | Тип                   | Для чего он нужен                                                                                                                  |
| ----------- | --------------------- | ---------------------------------------------------------------------------------------------------------------------------------- |
| `label`     | `string`              | Надпись кнопки в виде очищенного HTML с подставленным `{{total_price}}`.                                                           |
| `href`      | `string \| undefined` | URL оформления заказа. `undefined` в предпросмотре редактора, где переходить некуда.                                               |
| `isLoading` | `boolean`             | Здесь всегда `false`: блок отображает встроенный скелетон во время загрузки и вызывает ваш шаблон только после готовности корзины. |

<Warning>
  **Пользовательская кнопка checkout теряет отслеживание оформления заказа.** Встроенная кнопка добавляет обработчик клика, который генерирует SDK-событие [`checkout`](/ru/aftersell/cart/sdk-events#checkout) и записывает конверсию для [аналитики корзины](/ru/aftersell/cart/analytics). Этот обработчик не передаётся пользовательским шаблонам, поэтому навигация только через `href` пропускает и то, и другое.

  Если вам нужно это событие, генерируйте его самостоятельно из `onClick` перед навигацией. Отчётность по атрибуции таким способом всё равно не восстановить, поэтому предпочтительнее переоформить встроенную кнопку через [настройки дизайна](/ru/aftersell/cart/design-settings) или [пользовательский CSS](/ru/aftersell/cart/custom-css), если только вам действительно не нужна другая разметка.
</Warning>

Отображайте `href` как есть, не задавая значение по умолчанию. Элемент `<a>` без `href` неактивен, что является корректным поведением в редакторе.

<div id="design">
  ## Дизайн
</div>

Оформляйте этот блок в разделе **Design** его панели настроек. Это переопределения на уровне блока, которые накладываются поверх глобального дизайна и наследуют его, если поля пусты.

Что такое настройки дизайна? Подробнее здесь: [Настройки дизайна](/ru/aftersell/cart/design-settings).