Payment Systems Integration

By connecting payment systems, you will be able to accept payments for goods and services on your website. For example, you can create an online store without a shopping cart option by adding a payment form for each product.

With Taptop you can connect one of 24 payment systems :

PayAnyWay

Robokassa

Uniteller

Alfa Bank

SberBank

CDEK Pay

IntellectMoney

IntellectMoney2022

LifePay (RFI)

PayKeeper

PayMaster

PayPal

T-Bank (Tinkoff)

Unitpay

PSKB Bank

SDM-Bank

WalletOne (WalletOne Checkout)

ModulBank

Yoomoney (Yandex2019)

WebPay

Alfa Bank Belarus

Click

Octo.Uz

Payme

How payment method integration works

To set up integration with the payment system in Taptop, you need to:

Connect a payment system to the project. In the project settings, on the Integrations tab, you need to add one or more payment systems and configure the necessary parameters.

Create and configure a payment form on the website. In the Design Editor, you need to create a payment form (separate for each product) by adding the Payment widget on the canvas. Next, you need to configure the parameters of the payment form - link the payment system and indicate the name and price of the product. Now you can accept payments from users.

Accepting payments:

After filling out the payment form on your website, users will be redirected to the selected payment system page to pay for the product or service. You can view all orders and their payment statuses in the project settings in the Leads section.

Below, you can find detailed description of payment systems integration.

Connecting a payment system in the project settings

You can connect one or more payment systems on the Dashboard in the project settings. To do this, go to Integrations -> Payment systems.

To add a payment system to the project, click the Connect button.

Payment system setup steps

1. Select the name of the payment system from the list. If you start entering the name in the field, the system will automatically offer suitable options.

2. Select the payment currency. The list of available currencies depends on the selected payment system.

If a payment system offers more than one currency, you make connect several payment currency options. For example, you can add four options for Robokassa payment system for payment options in rubles, dollars, euros and Kazakhstani tenge. Each payment system and currency combination can be connected only once.

3. Fill in all the necessary settings — basic and additional settings.

The basic settings of the payment system allow you to transfer your data received when registering with the payment service to the system.

Also in the main settings you will find a payment link URL to which payment notifications will be sent. You must copy the link and add it to the appropriate field in your payment service account. The field name may differ for different payment systems, e.g. Pay URL, Notify URL, etc.

Additional payment system settings include the following parameters:

Tax name and percentage are fields for specifying taxes. By default, the option is disabled. If you want to add a tax, enable it and enter the name of the tax and its value as a percentage.

Sign of payment method: product or service.

Sign of payment method: full payment or prepayment.

System of taxation: tax calculation method

4. After filling out the form fields, click the Connect button to complete the payment system integration procedure.

You can see the list of all added payment services in the Payment systems section in the project settings.

Editing and deleting a payment system

The added payment system can be edited or deleted. To do this, click on the three dots to the right of the service name and select the corresponding menu item.

Creating and setting up a payment form on the website

After connecting the payment system to the project, you can create and set up a payment form. To do this, go to the Design Editor and add the Payment widget to the canvas.

The payment form contains:

Payment title that is displayed on the site.

Input fields for user data and comments:

Email

Phone

Description

You can configure settings for each input field on the Settings tab. You can add placeholders for all fields. For the Telephone field, you can additionally configure a mask that will allow you to check the correctness of the number entered by the user. Email and Telephone are mandatory fields, Description field is optional.

Pay button. After clicking this button, the user will be redirected to the payment service page and a new order will be created.

To change the form title, field or button name, click the corresponding element on the canvas.

For the payment form to work correctly, you need to configure its parameters on the Settings tab in the right panel.

General payment form settings

Form name . This name will be displayed in the list of orders in the project settings.

Form state . You can customize the appearance of default, successful payment or error forms. With these settings, you can provide the user with information about the payment status, as well as instructions in case of payment problems.

Having selected the desired form state, e.g. Error, you will see that the Error State element with an error message appears on the canvas instead of the form fields. You can edit this text to suit your needs and style it.

Fields state . You can customize the appearance of default and erroneous data entry fields. You will see an error message, if an incorrect phone number is entered or a required field is not filled in.

With Error status, red error messages are displayed. You can change the text of messages and style them based on your site design.

Payment system settings

With these settings you can link one of the connected payment services to the payment form. These parameters are mandatory for the form to work correctly on the site.

If one or more payment services have been added to the project, you will see the Add a payment system button.

After clicking the button, you need to fill out Payment settings:

Payment . Select one of the payment services connected to the project. For each form, you can select only one payment system.

Product name and price . This data is transmitted to the selected payment service to process a payment. After the user orders the product, these parameters will be displayed in the order data. You can see them in the project settings in the Leads section.

Open in new tab . With this setting the user can open payment system page in a new tab. By default, the page will open in the current window.

Possible problems with the payment form

Users will not be able to pay for an order on your website in the following cases:

1. Integration with the payment system has not been completed.

You have added a payment form to the website but have not enabled the payment system in the form settings. You will see the following message in your payment form settings:

You have added a payment form to the website but have not connected any payment system in the project settings. You will see the following message in your payment form settings:

You have added a payment form and a payment system to the website, and then deleted this payment system in the project settings. In this case, you need to either link another payment system to the form (from the list of those connected to the project), or add a new payment system in the project settings and then link it to the form.

2. Hosting has been expired. In this case, integration with payment systems will be disabled. Even if you have previously added a payment system and configured the payment form correctly, payment will not be possible without active Basic hosting plan.

In the payment form settings, a message will be displayed stating that you need to pay for hosting to continue.

In this case, when users try to pay, they will see the Error message.

View orders

All orders placed with payment forms on the website are displayed in the project settings in the Leads section.

The list contains the order form name, date, price and payment status. You can view detailed information about the order by clicking the Show results button in the corresponding list line.

After clicking the button, a pop-up will open containing order details: date, order ID, product name, amount, payment system, status and user data: e-mail, phone and comment.

You can also select orders using the checkbox to the left of the name and export them by clicking the Export button at the bottom of the page.

The list of orders will be exported as .xls file.