Это старая версия API. Переходите на [API ЮKassa](/developers). Виджет для кредитования — дополнительное решение ЮKassa для способа оплаты «Заплатить по частям». Оно позволяет быстро рассчитать ежемесячный платеж по кредиту и показать его пользователю. Если вы хотите отображать ежемесячный платеж, воспользуйтесь: * библиотекой [CheckoutCreditUI.js](#yc-credit-ui) и разместите с ее помощью готовую кнопку или информационный блок на вашем сайте; * [методом credit-pre-schedule](#credit-pre-schedule) для расчета ежемесячного платежа и используйте данные в своих формах.

С помощью этой JavaScript-библиотеки можно встроить виджет способа оплаты «Заплатить по частям» в вашу систему. Вы можете выбрать режим отображения виджета — **кнопка** или **информационный блок**. **Кнопку** можно встроить в корзину (когда пользователь выбрал товар). На кнопке отображается реальная сумма ежемесячного платежа. По кнопке пользователь попадает в процесс оформления кредита через ЮKassa. **Информационный блок** можно разместить в карточке товара или в каталоге, чтобы рассказать пользователю о возможности купить этот товар в кредит. В блоке отображается реальная сумма ежемесячного платежа. Перейти из блока в оформление кредита невозможно.

Чтобы начать работу, подключите библиотеку и создайте экземпляр . **Подключите библиотеку** ``` ``` **Создайте экземпляр CheckoutCreditUI** ``` const $checkoutCreditUI = CheckoutCreditUI(params); ``` где — параметры конфигурации.

| Параметр | Тип | Описание | |:--|:--|:--| |shopId|long|Идентификатор магазина, выдается при подключении к ЮKassa.| |sum|CurrencyAmount|Сумма заказа.| **Пример настройки CheckoutCreditUI** ``` const $checkoutCreditUI = CheckoutCreditUI({ shopId: '6677', sum: '3000' }); ```

Название	Описание	Принимает	Возвращает
[.update](#yc-credit-ui-methods-update)	Обновляет сумму ежемесячного платежа по кредиту и перерисовывает виджет.	{void}	{void}
[.on](#yc-credit-ui-methods-on)	Обработчик событий кнопки (работает для ).		{void}

Используется для вывода виджета. ``` $checkoutCreditUI.update(); ``` | Название | Описание | Тип | По умолчанию | |:--|:--|:--|:--| |domSelector|Селектор элемента в коде страницы, в котором будет выводиться виджет (id или class)|string|{void}| |type|Режим отображения виджета. Возможные значения: (кнопка), (информационный блок).|string|| |tag|Тег, в котором выводится кнопка (можно использовать, только если указан ). Возможные значения: , .|string|| |theme|Тема оформления кнопки (можно использовать, только если указан ). Возможные значения: или .|string|| Кнопку () можно настроить: * Выбрать тег, который будет в коде. Если , клик по кнопке равносилен клику по . Если , клик по кнопке обрабатывается как . * Выбрать тему оформления. Если отсутствует или , кнопка будет желтой. Если , кнопка будет белой. **Желтая кнопка с тегом input type='button'** ``` const checkoutCreditButton1 = $checkoutCreditUI({ type: 'button', theme: 'default', domSelector: '.parent1' }); ``` **Белая кнопка с тегом input type='submit'** ``` const checkoutCreditButton2 = $checkoutCreditUI({ type: 'button', tag: 'input', theme: 'white', domSelector: '.parent2' }); ``` **Информационный блок** ``` const checkoutCreditText = $checkoutCreditUI({ type: 'info', domSelector: '.parent3' }); ``` ![](credit_interface.svg)

Используется для обработки событий (нажатия на кнопку). Только для . ``` checkoutCreditButton.on = function() { alert('Submit'); }; ```

``` const $checkoutCreditUI = CheckoutCreditUI({ shopId: '6677', sum: '3000' }); const checkoutCreditButton = $checkoutCreditUI({theme: 'white', type: 'input', domSelector: '.parent'}); checkoutCreditButton.on = function() { alert('Submit'); }; ```

Этот метод позволяет заранее рассчитывать сумму ежемесячного платежа по кредиту для конкретного товара — при оплате через сервис ЮKassa «Заплатить по частям».

Запросы отправляются методом GET по протоколу HTTP/1.1. **Адрес для отправки запросов** ``` https://yoomoney.ru/credit/order/ajax/credit-pre-schedule ``` **Параметры запроса** | Параметр | Тип | Описание | |:--|:--|:--| |shopId|long|Идентификатор магазина, выдается при подключении к ЮKassa.| |sum|CurrencyAmount|Сумма заказа.| **Пример запроса** ``` https://yoomoney.ru/credit/order/ajax/credit-pre-schedule?shopId=6677&sum=10000 ``` **Параметры ответа** | Параметр | Тип | Описание | |:--|:--|:--| |term|long|Срок кредита или рассрочки, количество в месяцах.| |creditPercent|long|Кредитная ставка (процент в месяц).| |amount|CurrencyAmount|Сумма платежа в месяц.| |totalAmount|CurrencyAmount|Полная сумма кредита за весь период с процентами.| **Пример ответа** ``` { "term":12, "creditPercent":"3.90", "amount":"1223.33", "totalAmount":"14680.00" } ```

Способы оплаты