Платёжные виджеты на сайт
Виджет принимает оплату без разработки: вы вставляете на страницу готовый код, и покупатель платит, не уходя с сайта. Разработка не нужна, знания веб-технологий тоже: состав заказа и настройки задаются в конструкторе.
Если сумму и состав определяет только ваш сервер или заказы рождаются в учётной системе, виджета недостаточно — смотрите интеграцию по API или готовые модули CMS. Сравнение путей — в разделе Виджеты.
Как это работает
- Собрать. Настройки, живой предпросмотр и готовый код — в конструкторе. Понадобятся идентификатор магазина и региональный код: они приходят в письме при регистрации, а для пробы конструктор подставит демо-магазин.
- Скопировать код. Один блок с кнопкой — вставляется в любую вёрстку.
- Вставить на страницу. Примеры для обычного сайта, Тильды, WordPress, 1С-Битрикс и мобильного приложения — в инструкции по вставке.
Что подготовить на сайте
| Страница | Зачем нужна |
|---|---|
| Страница с виджетом | здесь стоит код и покупатель вводит свои данные; подойдёт любая, даже главная |
| Страница завершения | сюда виджет вернёт покупателя и после успешной оплаты, и после неудачной. Её адрес указывается в настройках виджета — полезно описать на ней, что делать дальше |
Настройки виджета
Все параметры задаются в конструкторе; ниже — что каждый из них меняет. Если код виджета придётся править руками — например, подставлять номер заказа из своей системы, — смотрите справочник параметров: там перечислены поля кода, состав заказа и значения, которые они принимают.
| Настройка | Что задаёт | Когда нужна |
|---|---|---|
| Что оплачивают | заранее заданный состав заказа либо свободная сумма | состав — для товаров и услуг с известной ценой; свободная сумма — для пополнения баланса и абонентской платы |
| Текст на кнопке | подпись кнопки виджета | набор текстов расширяется по запросу в поддержку |
| Дополнительные поля | что покупатель заполнит сам: номер заказа, фамилия и имя, телефон, почта, количество | хотя бы одно из двух — почта или телефон — обязательно: по ним уходят счёт и документы |
| Тип плательщика | физическое лицо, организация или ИП, выбор покупателем | для оплаты от организаций и ИП выбирайте второй вариант: тогда формируется счёт и закрывающие документы |
| Код товара или услуги | ваш идентификатор заказа, договора или артикула | обязателен: по нему вы узнаёте платёж в своей системе |
| Ссылка возврата | адрес страницы завершения оплаты | заполняется всегда, иначе покупателю некуда вернуться |
| Оплачиваемые позиции | название, количество, цена и ставка НДС каждой позиции | минимум одна позиция; ставки — в справочнике |
| Выбор одной позиции | покупатель выбирает один вариант из списка | удобно для тарифов: перечислите варианты, покупатель отметит нужный |
| Открывать в новом окне | форма открывается в новой вкладке или в текущей | снимите отметку, если хотите оставить покупателя на странице |
Что важно знать до вставки
Сумма и состав заказа приходят из браузера покупателя и не подписаны — их можно изменить в браузере до отправки. Это осознанное упрощение ради быстрого старта, но оно накладывает обязанность: получив уведомление об оплате, сверяйте сумму с той, которую ожидали. Если цену определяет только ваш сервер, надёжнее создавать заказы через API. Подробно — Безопасность виджета.
Прежний конструктор на widget.invoicebox.ru продолжает работать: код, собранный там и в конструкторе портала, одинаковый.
Примеры виджетов
Ниже — живые виджеты в песочнице портала: та же форма, что увидит покупатель на вашем сайте. Собраны они на демо-магазине документации, поэтому оплата ничего не спишет. Свой виджет собирается в конструкторе — настройки слева, код справа.
Счёт организации или ИП. Состав задан заранее, покупатель вводит только реквизиты. Так выставляют счёт за услуги по договору.
Оплата товара с количеством. Покупатель меняет количество, сумма пересчитывается на месте.
Выбор из нескольких позиций. Покупатель выбирает тариф или товар из списка.
Пополнение баланса. Сумму вводит покупатель — подходит для депозитов и абонентской платы.
---