General Information
The Payment Page is the fastest and easiest way to integrate with Solidgate. With the help of the Solidgate Payment Page, you can create a payment page, share a URL with your customers or implement it on your website.
You can use the Payment Page in the following cases:
- when the integration on the site is still being prepared (or the site is a tilde page). You can get the link to the Payment Page via the API
- as an alternative variant to the Payment Form built into the page
Please note that the link to the payment page expires in 24 hours.
Getting started
1. Setup Payment Page
In order to receive the URL to the Payment Page, please follow these steps:
- Create the request body
- Generate the Signature from the JSON body and add the Merchant and Signature to the header of the Request
- Make a POST request with the Headers and Body
Please be advised that you can use our postman collection to generate a Payment Page link. You only require to pass the mandatory fields and your channel data.
2. Page Request
The body includes two objects: order information and page customization. The mandatory body parameters are described in the Request Body.
Please take into consideration that you can also pass more order or/and page customization information, but these parameters are optional.
3. Signature Generation
The signature verifies whether the request is unique on the Solidgate server. The signature is generated from the JSON body on your Backend side.
The detailed process of generating the Solid Payment Form initialization signature is described in the following article.
In order to authenticate to Solidgate API, you require to add the following headers to each request:
- Merchant - public_key of your channel keys;
- Signature - a signature of the request
Please not ehat this allows verifying whether the request is genuine on the payment gateway server, that you receive in the previous step.
Please be advised that you require to use API keys with the “All” type to display PayPal on the payment page.
4. Request with the Headers and Body
In order to obtain a Payment Page URL, you need to make a POST request with the headers and body JSON to the Solidgate endpoint.
POST: https://payment-page.solidgate.com/api/v1/init
You need to use the advised sample query with a minimal set of parameters to get the URL of the payment page.
var private_key = "";
2var public_key = "";
3var order_id = new Date().getTime() + "payment_page";
4
5var data =JSON.stringify(
6 { "order": {
7 "currency": "USD",
8 "amount": 1000,
9 "order_id": order_id,
10 "order_description": "Order description",
11 "customer_email": "[email protected]"
12 }, "page_customization": {
13 "public_name": "Merchant",
14 "order_title": "Jordan Series Mid; W 8.5",
15 "order_description": "Classic meets modern in this fresh take on a Jordan Brand essential. Durable leather and suede are bolstered by lightweight synthetics for extra support. The iconic midtop silhouette is more breathable than ever with a perforated sockliner. Plus, inspirational messages nodding to MJ's origin story are incorporated into the design, adding meaning to every step."
16 }
17})
18
19var hash = CryptoJS.HmacSHA512(public_key + data + public_key, private_key);
20var signature = btoa(hash.toString(CryptoJS.enc.Hex));
21postman.setEnvironmentVariable("data", data);
22postman.setEnvironmentVariable("Merchant", public_key);
23postman.setEnvironmentVariable("Signature", signature);
As a response, you will receive the JSON with the URL and guide of the Payment Page link created.
5. Components of Payment Page
The Payment Page is divided into two blocks:
- Merchant block
- Solidgate block (Payment Page Basis)
It is important to keep in mind that Payment Page can be opened both on the desktop and on mobile, and the location of blocks in this case is different.
a) Merchant block
Information in the merchant's block:
- Merchant Info (Name&Logo)
- Terms and Conditions
- Order Info
- Product Info
- Back Button
b) Solidgate block
This block contains all the information that is necessary for the payment, or that we can display on the Payment Page:
- Payment Fields
- Wallets (Apple Pay / Google Pay)
- Alternative Payments
- Additional Info
- Legal Info
- Select Language
Payment information
When a payment is completed using the Payment Page, Solidgate sends the webhook you can use for fulfillment and reconciliation. For more information, see the guide for notifications.
Additionally, you can also find the order completed by Payment Page in Solidgate HUB.