Гайд по разработке интерфейса модуля ЮKassa

Интерфейс настроек

Так должны выглядеть настройки модуля ЮKassa, как только пользователь их открывает.
Блок 1

Эти поля пользователь заполняет параметрами, которые получил в ЮKassa. Оба поля обязательны для заполнения. У полей должны быть ограничения:

shopId — можно вводить только цифры, ограничений по количеству символов нет.

Секретный ключ — можно вводить цифры и латинские буквы, ограничений по количеству символов нет.

Техническая документация: аутентификация

Блок 2

Этот блок определяет, где будет процесс оплаты — на сайте ЮKassa или на сайте магазина.

Блок 3

Чтобы наши общие пользователи могли работать с ККТ через ЮKassa, вам нужно передавать нам название, цену и НДС товара при каждом платеже. Клиент настраивает отправку данных специальным тумблером.

Блок 4

Адрес для уведомлений генерируете вы: пользователь не может его отредактировать (только скопировать). Пользователю он потребуется только для обращений в службу поддержки ЮKassa.

Техническая документация: уведомления

Блок 5

Это кнопка, которая включает приём платежей. Если все заполнено верно, после нажатия сообщите об успехе: Настройки сохранены.

Когда пользователь начинает заполнять настройки, разворачиваются дополнительные блоки. Так должна выглядеть полностью развёрнутая форма:
Блок 1

Пользователь выбирает, где будет проходить оплата: На стороне ЮKassa или На стороне магазина. Если пользователь выбрал На стороне магазина, разворачивается блок Отметьте способы оплаты из договора.

Выбрать сразу оба пункта нельзя. Ничего не выбрать тоже нельзя. По умолчанию отметка стоит На стороне ЮKassa.

Подробнее о сценариях оплаты
Блок 2

Если ваши пользователи всегда указывают НДС для товаров или ставка в вашей системе задана по умолчанию, тумблера будет достаточно.

Если в вашей системе НДС — это необязательная настройка, пользователю нужно задать её на этой странице: в этом случае разворачивается блок НДС. В нём два поля — Ставка по умолчанию и Ставка в вашем магазине.

Ставка по умолчанию

Это разворачивающийся список из шести ставок НДС: Без НДС, 0%, 10%, 20%, Расчётная ставка 10/110, Расчётная ставка 20/120.

Нужно выбрать одну, по умолчанию указано 10%.

Сопоставьте ставки

Здесь пользователю нужно сопоставить ставки, которые он уже задал в магазине, со ставками, которые ЮKassa передаёт в налоговую.

Цифра слева — это ставка НДС, которую задал пользователь в вашей системе.

Выпадающий список справа — это ставки НДС для чека в налоговую.

Количество строчек зависит от того, сколько ставок НДС пользователь задал в вашей системе. Если пользователь раньше не задавал ставки на сайте, этого блока не будет.

Техническая документация: оплата по 54-ФЗ

Если есть ошибки, подскажите, где они и как их исправить.

Важные моменты

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

Тексты для интерфейса

Скопируйте тексты из файла и вставьте в свой интерфейс.

Интерфейс возвратов

Если в вашей системе есть возможность делать возвраты платежей, пожалуйста, используйте этот шаблон для страницы возврата.
Если пользователь включил отправку данных для чеков через ЮKassa, интерфейс выглядит так:
Важно, чтобы пользователь указывал не сумму возврата, а товары, стоимость которых нужно вернуть — тогда сумма возврата будет меняться автоматически. Это нужно, чтобы в налоговую уходил новый чек — с оставшимися товарами и суммой, которая им соответствует.

Тексты для интерфейса

Скопируйте тексты из файла и вставьте в свой интерфейс.

Названия, логотипы и описание сервиса

Название сервиса

ЮKassa — две заглавные буквы; Ю — кириллицей, Kassa — латиницей. Без пробелов, точек, тире и кавычек. Название не склоняется:
  • подключение к ЮKassa,

  • заплатить через ЮKassa,

  • настройки ЮKassa.

В англоязычных текстах используйте название YooKassa.

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

Пожалуйста, называйте способы оплаты так, как указано здесь: так ваши пользовали быстрее сориентируются в настройках.
  • Банковские карты — Visa, Mastercard и Maestro, «Мир»

  • ЮMoney

  • WebMoney

  • QIWI Wallet

  • Наличные

  • Альфа-Клик

  • Промсвязьбанк

  • Сбербанк Онлайн

  • Баланс мобильного — Билайн, Мегафон, МТС, Tele2

  • Кредитование — Заплатить по частям

Логотип

Пожалуйста, используйте логотип ЮKassa в списке платежных систем, на странице настроек платёжного модуля и в инструкции по настройке.
Правила размещения:
  • ширина поля — размер внутреннего радиуса круга из логотипа,

  • цвет:

на белом и светлом фоне используйте сине-черный логотип
Скачать логотип
на ярком цветном фоне — сине-белый логотип
Скачать логотип
на чёрном и тёмном цветном фоне — белый логотип
Скачать логотип

Описание

Если вам где-то требуется описание ЮKassa (например, в списке платёжных систем), используйте этот текст:
ЮKassa — сервис, который позволяет включить приём платежей на сайте и получать деньги на расчётный счёт компании. Комиссия берётся с успешных платежей.
Способы приёма платежей: банковские карты, ЮMoney и QIWI, интернет-банки, наличные, баланс мобильного и другие.
Перейти на сайт ЮKassa

Инструкция по настройке

С инструкцией ваш пользователь быстрее настроит приём платежей. В ней можно ответить на вопросы, которые задают (или будут задавать) чаще всего. Мы разместим ссылку на вашу инструкцию на сайте ЮKassa, а вы можете разместить ее на своем сайте, рядом с модулем или прямо в настройках модуля.
Чтобы составить инструкцию, вы можете использовать наш шаблон: поправьте его с учётом возможностей своего модуля и интерфейса, добавьте скриншоты.
Скачать шаблон инструкции