Форма оплаты на сайте: создание и настройка
Для подключения платежей на вашем сайте сначала необходимо добавить платежную систему в настройках проекта.
Для создания формы оплаты на сайте перейдите в Редактор дизайна и добавьте на холст виджет Payment.
Для каждого товара необходимо создать отдельную форму оплаты и настроить ее параметры. Вы можете добавить на сайт любое количество форм оплаты, выбрав для каждой свою платежную систему. Например, для одного товара настроить оплату через СберБанк, а для другого — через Robokassa.
Вы можете разместить форму оплаты прямо на странице или в поп-ап, а также настроить ее внешний вид по своему желанию — так же, как это делается для обычной формы.
Форма оплаты содержит:
1) Заголовок формы, который отображается на сайте.
2) Поля ввода, где пользователь будет заполнять свои данные и комментарии к заказу:
- E-mail
- Телефон
- Описание
В форму нельзя добавить другие поля или удалить существующие.
Вы можете настроить параметры для каждого поля ввода на вкладке Настройки.
- Для всех полей можно добавить фоновый текст (placeholder).
- Для поля Телефон можно дополнительно настроить маску, которая позволит проверять корректность введенного пользователем номера.
- Поля E-mail и Телефон обязательны для заполнения.
- Поле Описание — по умолчанию необязательное, но вы можете включить для него эту опцию в настройках.
3) Кнопку Оплатить — после нажатия на эту кнопку пользователь будет перенаправлен на сайт платежного сервиса для оплаты, и будет создан новый заказ.
Чтобы изменить заголовок формы, подписи к полям или название кнопки, кликните на соответствующий элемент на холсте.
Для корректной работы формы оплаты необходимо настроить ее параметры на вкладке Настройки на правой панели.
1) Название формы (Form name). Это название будет отображаться в списке заказов в настройках проекта.
2) Состояние формы (Form state). Вы можете настроить дизайн формы в статусах «По умолчанию», «Успешно» и «Ошибка».
- Статус «По умолчанию» — как выглядит форма при загрузке страницы — до того, как пользователь ее заполнит. Здесь вы можете изменить дизайн формы — например, отредактировать заголовок, названия полей и их стили.
- Статус «Успешно» — сообщение, которое выводится после успешной отправки формы — когда редирект на сторону платежной системы прошел без ошибок. Вы можете изменить текст и стили сообщения, например, шрифт или цвет текста.
- Статус «Ошибка» — сообщение, которое выводится после отправки формы с ошибкой — например, когда не ответил сервер или настройки платежной системы некорректны. Вы можете изменить текст и стили сообщения, например, шрифт или цвет текста.
3) Состояние полей (Fields state). Можно настроить отображение полей по умолчанию и при ошибочном вводе данных, например, в случае ввода некорректного номера телефона или незаполненного обязательного поля.
При состоянии полей формы в статусе «Ошибка» сообщения об ошибке отображаются под ними красным цветом. Вы можете изменить текст сообщений и настроить их стили, исходя из дизайна вашего сайта.
Данные настройки позволяют привязать к форме оплаты один из платежных сервисов, подключенных к проекту. Заполнение этих параметров обязательно для корректной работы формы на сайте.
Если в настройках проекта не подключено ни одной платежной системы, то в этом разделе будет отображаться уведомление о необходимости ее добавить.
Если в проект добавлены один или несколько платежных сервисов, вы увидите кнопку «Подключить платежную систему».
После нажатия кнопки вам нужно заполнить Настройки формы оплаты (Payment settings):
- Платежная система (Payment). Выберите один из платежных сервисов, подключенных к проекту. Для каждой формы можно выбрать только одну платежную систему.
- Название и стоимость товара (Product name, Price). Эти данные передаются в выбранный платежный сервис для оплаты заказа. После заказа товара пользователем эти параметры будут отображаться в данных заказа — их можно просмотреть в настройках проекта в разделе «Заявки» (Leads).
- Открыть в новой вкладке (Open in new tab). Настройка позволяет при перенаправлении пользователя на сайт платежной системы открывать его в новой вкладке. По умолчанию сайт откроется в текущем окне.
Пользователи не смогут оплатить заказ на вашем сайте в следующих случаях:
1. Не завершена интеграция с платежной системой.
- К форме не подключена платежная система. Вы добавили на сайт форму оплаты, но не подключили платежную систему в настройках формы. Вы увидите следующее сообщение в настройках формы оплаты:
- В настройках проекта не добавлена платежная система. Вы добавили на сайт форму оплаты, но не подключили ни одной платежной системы в настройках проекта. Вы увидите следующее сообщение в настройках формы оплаты:
- В настройках проекта удалена платежная система. Вы добавили на сайт форму оплаты и подключили к ней платежную систему, а затем удалили эту платежную систему в настройках проекта. В этом случае вам необходимо либо привязать к форме другую платежную систему (из списка подключенных к проекту), либо добавить новую платежную систему в настройках проекта и затем привязать ее к форме.
2. У проекта закончился хостинг — истек срок действия тарифа хостинга Basic. В этом случае интеграция с платежными системами будет отключена.
Даже если вы ранее добавили платежную систему и корректно настроили форму оплаты, без подключенного тарифа хостинга Basic проведение оплаты будет невозможно.
В настройках формы оплаты будет отображаться сообщение о том, что для возобновления работы нужно подключить хостинг.
Вы можете быстро отслеживать возможные проблемы с платежными формами на вкладке слоев. Формы, недоступные для оплаты, будут помечены специальной иконкой с предупреждением справа от их названий.
В этом случае при попытке оплатить заказ пользователи увидят форму в состоянии ошибки.