Здравствуйте, сегодня попробуем вставить на свой сайт форму оплаты услуг и товаров через систему QIWI.

Скачать исходники для статьи можно ниже

Данная статья является продолжением моей предыдущей статьи:

Регистрация QIWI кошелка для интернет магазина и плагин для QIWI кнопки

В вышеуказанной статье мы зарегистрировали QIWI кошелек для своего интернет магазина в качестве физического лица и установили кнопку оплаты с помощью плагина, однако, более удобно воспользоваться формой для оплаты услуг и товаров, которую нам предлагает сервис QIWI.

Давайте же ее рассмотрим.

Заходим в свой кабинет на сайте https://ishop.qiwi.ru.

И переходим в пункт “Способы подключений”, в нем выбираем подпункт “Форма в iframe”:

Спускаемся вниз и видим, код для вставки формы на сайт:

<form method="get" action="https://w.qiwi.ru/setInetBill_utf.do" target="iframeName" >
  <input name="from" value="5794">
  <input name="to" value="9151111111">
  <input name="summ" value="0.01">
  <input name="com" value="test">
  <input name="iframe" value="true">
  <input type="submit">
 </form>
 
 <iframe name="iframeName" frameborder="0" width="550" height="700"></iframe>

И выглядеть она будет следующим образом (достаточно много не нужных полей, которые нужно скрыть или переименовать):

Если вам не понятно, за что отвечают те или иные поля, то советую открыть вам подпункт “HTTP-протокол” (пункт “Способы подключения” и его подпункт “HTTP-протокол”), в котором вы и увидите описания данных полей формы:
 

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

После нажатия на кнопку “Купить” появится следующее окошко:

Строчка с полем “from” отвечает за “ваш id в нашей системе”:

 <input name="from" value="5794">

id моего кошелька 220942, поэтому меняю его в данной строке, также давайте скроем данное поле для посетителя, а для этого нужно добавить еще код: type=”hidden” и строчка будет выглядеть следующим образом:

<input type="hidden" name="from" value="220942">

Следующая строчка с полем “to” отвечает “id пользователя Visa QIWI Wallet, которому Вы выставляете счёт” или просто номер телефона:

<input name="to" value="9151111111">

Данное поле оставим видимым для посетителя, только значение поля поменяем на “номер телефона” и получим следующее:

<input name="to" value="Номер телефона">

Следующая строчка с полем “summ” отвечает “сумму в рублях”, которую пользователь платит:

<input name="summ" value="0.01">

Если вы хотите сделать ее фиксированной и скрыть данное поле, чтобы посетитель не смог ее поменять, то делаем ее вот такой:

<input type="hidden" name="summ" value="100">

То есть покупатель заплатит нам 100 рублей.

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

<input name="summ" value="сумма в рублях">

Следующая строчка с полем “com” отвечает за “Комментарий, который увидит пользователь, когда получит счёт”

<input name="com" value="test">

Если вы хотите сделать данное поле невидимым для покупателя, то опять добавляем код type=”hidden”, например так:

<input type="hidden" name="com" value="за услугу №1">

Если же вы хотите дать посетителю оставить комментарий, то оставляем строчку как нибудь так:

<input name="com" value="назначение платежа">

или

<input name="com" value="комментарий">

Следующую строчку с полем “iframe” нужно скрыть от покупателя, чтобы не вводить его в заблуждение:

<input name="iframe" value="true">

преобразуем ее в следующую:

<input type="hidden" name="iframe" value="true">

Рассмотрим следующую строчку с полем “submit”, отвечающую за вывод кнопки:

<input type="submit">

преобразуем ее в следующую:

<input type="submit" value="Купить">

Тогда на кнопке появиться надпись не “Отправить”, а “Купить”.

 
PS: Так как в моем кошельке еще не подключена функция оплаты через мобильные телефоны, то функция оплаты не видна, но после активизации данной функции форма оплаты будет такой:

Попозже продолжу статью…