Как подключить оплату на сайт

Есть много способов начать принимать платежи на вашем сайте. Поставить WooCommerce или вообще шаблон магазина.

А как быть если вы продаёте свои курсы или скажем какие-либо продукты не связанные со складом или большим ассортиментом, да и верификации на платёжках для магазина слишком дорого (например на webmoney, чтобы получить аттестат персональный прийдёться помучиться, не слабый геммор придумали – всё ж для людей!).

Магазин тема вам вряд ли подойдёт, плагин Woocommerce тоже , кто будет собирать в корзину курсы или продукты совершенно не связанные между собой, ну разве что юпитерианцы, они всегда так делают.

Так вот предлагаю, для тех кто не знает, подключить на сайт оплату не хитрым способом. Довольно просто и действенно. Всё работает на ура.

Какие платёжки выбрать? Нужно максимально расширить вид оплат и при этом не городить пару гектаров. Я предлагаю выбрать три варианта оплат, где максимальный охват всех видов, я бы сказал популярных видов переводов.

  • Webmoney – один из популярных сервисов для оплаты в интернет.

Заводим кошелёк, у кого ещё нет (стыдно батенька, в наше то время), проходим по этому адресу

https://merchant.webmoney.ru/conf/default.asp

Оплата на сайт через webmoney

Щёлкнув по большой зелёной кнопке вы перейдёте на следующую страницу и как в песне В. Высоцкого: “Там хорошо, но мне туда не надо” .

А перейдём мы на следующей странице вот по этой кнопке (Список кошельков) туда куда нам надо

Эта страница нам ещё понадобиться после того как настроим сами кошельки. Для этого и переходим в Список кошельков.

Я надеюсь, что вы уже создали себе кошелёк RU и Z. Надо их настроить для приёма зелёных и красных. А попросту включить.

Нигде ничего не трогаем, кроме вот этого

Ставим в рабочий вариант, email и остальное уже будем менять на конструкторе, переходим по этой кнопке, далее по зелёной кнопке

Вот наша страница где мы редактируем свои данные.

  1. Адрес страницы получения заказанного товара. То есть, когда посетитель провёл оплату успешно через weboney, его перебрасывает на эту страницу, где он уже непосредственно может получить ссылку на скачивание или что вы там себе придумаете для своей реализации товара.

Для этого у вас уже должна быть страничка заготовлена, сделайе сами или попросите на work-zilla у фриласнов, или у меня)) вот такая, примерно, страничка..

Могу подсказать на чём вывесить свою страничку, чтобы не покупать хост с доменом. Идите ( да идите вы…) в Джаст клик –  justclick.ru. Создайте аккаунт и в кабинете выберите Страницы – создать

Адрес странички впишите в пункт № 1 в предыдущем изображении.

2. Тестовый товар замените на имя вашего товара или продукта, допустим Сырррр…

3. Выберите кошелёк – фунты стерлядей.

4. Цену.

5. Адрес email для оповещения о сделке.

Кликаем – Дальше >>

Переходим на такую же страницу и вписываем ещё раз email, затем опять Дальше >>

Перед нами выбор форм:

Форма конечно рогатая, лучше взять кнопку и поменять в ней стиль. Существующий заменить на тот который вы сможете сделать в

Генератор CSS кнопок

.

 Чтобы реализовать с картинкой примерно так

Всё хорошо, но… с webmoney это прокатит всего один раз, то есть кнопка созданная будет вести на тот адрес который был указан в настройках кошелька, ещё одну кнопку создав и в конструкторе вписав адрес получения уже другого продукта, покупатель будет переходить после оплаты по второй кнопке на странцу первой, как я уже говорил, на ту страницу которая стоит в настройках кошелька.

Ну почему так тупо работает Вебмани?? Для меня тоже остаётся большим вопросом. Разве что можно сделать три кнопаря RU, E, Z

или подключить Интеркассу, если у вас есть персональный аттестат, то каждая кнопка будет вести на кассу к которой подключен weboney

  • Интеркасса –  Ещё одна платёжка, хороша тем что имеет подключения через другие платёжные системы, для более широкого выбора при оплате.

Регистрируем аккаунт и в левом верхнем углу кликаем Создать кассу

В всплывающем окне впишем адрес своего сайта и имя платежа – это и будет название кассы. Например “Гравицапа от Пипелаца”

Далее выбираем валюту и отмечаем без договора, чтобы проще и быстрее.

Появиться касса с зелёным ярлыком New

 

Теперь нам надо Подтвердить владение кассой, кликаем по этой надписи, выбираем способ подтверждения..

Я обычно просто скачиваю и загружаю файл в корень сайта, подтвердив его можно потом удалить. Таким образом можно создать сотни касс, а если всё размещать в мета-тег, то я представляю как раздуется сайт для яндекс и гугл бота )))

Подтвердив щёлкаем на ручку в правом углу кассы и переходим в редакцию.

    1. Общие настройки – ничего сложного, пропишите ваши данные, можете добавить лого товара (просто картинка размером не более 200х160 px). Включите Уведомления, то ли на мобильный, то ли на email. Или всё сразу, того и другого побольше..))
    2. Настройки платежей – следующая вкладка  включите Проверять уникальность платежей и Передавать описание на платежную систему , выберите Время жизни платежа (в минутах) – 1 неделя с головой хватит и внизу включить разрешить переопределять в запросе
    3. Платёжные системы – Определите кто платит комиссионные, плательщик или вы. Включите ниже платёжки которые ждут активации.  Тестовую не включайте
    4. Интерфейс –  вставляем URL страничек: 1. Получение товара; 2. Страница (которую вы предварительно создали) Ошибки платежа; 3. Страница ожидания платежа

Внизу раскройте  вкладку или аккордеон, кому как больше нравиться, и впишите Ok на английской раскладке клавиатуры

Всё больше никуда здесь не лезем. Переходим в Мои кассы и берём ID кассы

Затем чтобы отобразить кассу кнопкой берём вот этот код, я уже сделал кнопку зелёной, если не гуд меняйте сами в Генератор кнопок

код кнопки

                                                                                                                   .kassa{text-decoration:none; text-align:center; border:solid 1px #008bc7; -webkit-border-radius:4px; font:18px Arial, Helvetica, sans-serif; background-color:#6bed5f; background-image: -moz-linear-gradient(top, #6bed5f 0%, #39a339 100%); background-image: -webkit-linear-gradient(top, #6bed5f 0%, #39a339 100%); background-image: -o-linear-gradient(top, #6bed5f 0%, #39a339 100%); background-image: -ms-linear-gradient(top, #6bed5f 0% ,#39a339 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=’#39a339′, endColorstr=’#39a339′,GradientType=0 ); background-image: linear-gradient(top, #6bed5f 0% ,#39a339 100%);   -webkit-box-shadow:1px 3px 2px #474242, inset 0px 0px 1px #ffffff; -moz-box-shadow: 1px 3px 2px #474242,  inset 0px 0px 1px #ffffff;   box-shadow:1px 3px 2px #474242, inset 0px 0px 1px #ffffff;   text-shadow: 1px 1px 0px #4d4d4d; filter: dropshadow(color=#4d4d4d, offx=1, offy=1); } border:solid 1px #c7002e; -webkit-border-radius:2px; font:18px Arial, Helvetica, sans-serif; background-color:#97fcd0; background-image: -moz-linear-gradient(top, #97fcd0 0%, #77f2cb 100%); background-image: -webkit-linear-gradient(top, #97fcd0 0%, #77f2cb 100%); background-image: -o-linear-gradient(top, #97fcd0 0%, #77f2cb 100%); background-image: -ms-linear-gradient(top, #97fcd0 0% ,#77f2cb 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=’#77f2cb’, endColorstr=’#77f2cb’,GradientType=0 ); background-image: linear-gradient(top, #97fcd0 0% ,#77f2cb 100%);   -webkit-box-shadow:0px 0px 2px #474242, inset 0px 0px 1px #ffffff; -moz-box-shadow: 0px 0px 2px #474242,  inset 0px 0px 1px #ffffff;   box-shadow:0px 0px 2px #474242, inset 0px 0px 1px #ffffff;   text-shadow: 1px 1px 0px #4d4d4d; filter: dropshadow(color=#4d4d4d, offx=1, offy=1);} border:solid 1px #0bbf29; -webkit-border-radius:4px; font:18px Arial, Helvetica, sans-serif; background-color:#a4f5fc; background-image: -moz-linear-gradient(top, #a4f5fc 0%, #78f0ec 100%); background-image: -webkit-linear-gradient(top, #a4f5fc 0%, #78f0ec 100%); background-image: -o-linear-gradient(top, #a4f5fc 0%, #78f0ec 100%); background-image: -ms-linear-gradient(top, #a4f5fc 0% ,#78f0ec 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=’#78f0ec’, endColorstr=’#78f0ec’,GradientType=0 ); background-image: linear-gradient(top, #a4f5fc 0% ,#78f0ec 100%);   -webkit-box-shadow:0px 0px 2px #474242, inset 0px 0px 1px #ffffff; -moz-box-shadow: 0px 0px 2px #474242,  inset 0px 0px 1px #ffffff;   box-shadow:0px 0px 2px #474242, inset 0px 0px 1px #ffffff;   text-shadow: 1px 1px 0px #4d4d4d; filter: dropshadow(color=#4d4d4d, offx=1, offy=1);}

Подставляете значение value свои вместо: “ваш id кассы“; “цена продукта“; “Название продукта“.

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

  • Яндекс деньги – проще всех предыдущих.

Заводим аккаунт, в левом меню нижнее  Прием платежей, выбираем это

Следующая страничка

я выбрал кнопку и после несколько не хитрых манипуляций получил код

в Адрес для редиректа вставляем URL получения продукта после оплаты, куда перекинет терпилу))

После всего полученного, приложим немного фантазии, умения в CSS и получим нечто подобное

Посмотреть в живую можно здесь

.