There are dozens of things to take care of when you are starting an e-commerce company. Strictly speaking from the perspective of integrating with a payment gateway, you would no doubt want to get started as soon as possible and want everything to be just perfect.
While you took good care of making sure that the payment gateway supports all the payment options, can process payments securely, has a great customer care service, etc.
One aspect of the payment gateway that you should consider giving a little extra time to is the checkout experience that the payment gateway provides. User experience on the checkout page might make or break your online business.
Paytm Payment Gateway offers two very intuitive checkout flows – JS Checkout and Custom Checkout – that work seamlessly with web as well as mobile apps. Irrespective of which checkout flow you choose, Paytm PG will make sure your customers will have the best payment experience.
In this article, we will discuss the differences between both the checkout flows. But first, let’s understand the importance of checkout pages and how they can affect your sales.
Importance of checkout pages
Imagine you are at a restaurant eating a delicious fruit bowl or a salad. Suddenly in the last bite, you get a sour grape or a mango. While you enjoyed the fruit bowl, the last bite ruined the whole experience and chances are you are going to remember that for quite some time.
Similarly, even though your customers are impressed with the collection of products your online store has, if the checkout experience is not good, they are going to dump their e-cart and will leave your site with a bad impression.
Interesting Read: JS Elements: Offer Native Checkout Experience with Least Tech Effort
In fact, a shoddy user experience at the checkout page is one of the primary reasons why customers abandon their carts. The rate of cart abandonment in India is at 51 percent, according to research by Indian Marketers.
You can’t force your customers to spend time on the checkout page punching in their personal details. While deciding on the checkout page, the main challenge for you as an e-commerce merchant is to find a balance between seeking information from customers and letting them pay and leave the website.
Many e-commerce websites lose customers as they keep a lengthy checkout page asking users to fill in a lot more details than required or they are comfortable with.
How the checkout page looks also determines whether a customer is going to pay or abandon the cart. Customers might not trust a website if your checkout page is not customised as per the rest of the website. A lot of redirections to the payment gateway or to the bank’s page is also off-putting for buyers.
What checkout options does Paytm Payment Gateway offer?
If you are looking for a payment gateway that provides a variety of checkout options, you can opt for Paytm Payment Gateway.
With Paytm PG you get ample flexibility to design your checkout page as per your design requirements. You can opt for one of the two types of checkouts that Paytm PG provides.
1. JavaScript (JS) Checkout
The JS Checkout solution is a simple two-step integration process. The fact that it doesn’t require much coding or tech knowledge to integrate, it is specifically useful for small and medium-sized businesses that lack a large tech team.
If you are opting for the JS Checkout flow you will only have to integrate a JavaScript code, which is custom-made by Paytm PG for your online store.
You simply need to follow these two steps to start accepting online payments:
Step 1: Integrate a single S2S API to initiate the transaction
Step 2: Embed the custom-made JavaScript code on the checkout HTML code of your online store
With JS Checkout you don’t have to go through the hassle of integrating different APIs for different devices and use cases.
2. Custom UI SDK Checkout
Custom Checkout flow from Paytm PG is a swift and seamless payment experience that allows you to completely control the checkout flow as well as the look and feel of the payment page.
Paytm uses an extremely powerful SDK to help users make payments. In simple terms, an SDK abbreviated for Software Development Kit is a set of software tools and algorithms that help website developers accelerate the payment process on any e-commerce platform or website that has a checkout option.
Paytm uses an all-in-one SDK, which is easy to integrate and doesn’t take up much space. Once you integrate Custom Checkout, your customers can make express checkout using Paytm as their default payment option.
Interesting Read: Faster and higher payment success rate with Paytm All-in-One SDK
Depending on the users’ handset, there are two payment flows:
- If a user has the Paytm app installed, it takes them directly to the app
- If a user does not have the app, it takes them to the default browser to make the payment
Difference between JS Checkout and Custom Checkout
JS Checkout | Custom Checkout |
| The checkout page shows the Paytm Payment Gateway logo. Although, merchants can still customise the page | Higher flexibility to customise the checkout page and payment flow. Merchants can customise their checkout page with personal brandings like logos and brand-specific colours |
| Simple and quick integration process. Requires minimal coding effort with just a few code integrations into the HTML code of merchants’ website | Merchants need to install Paytm’s All-in-One SDK, which is a very small size file |
| Paytm Payment Gateway owns the payment flow | Merchants own the user interface and the payment flow. SDK doesn’t provide any UI screens |
| No redirection is required; customers make the payment on the merchant’s website itself | Customers are redirected to Paytm’s web-view site if the Paytm app is not installed. Once the payment is over, customers are redirected to the merchant’s app |
| Customers need to enter their OTP and CVV to make payment | Customers can pay without punching their OTP and CVV numbers if they have the Paytm app on their phones |
| Does not support onboarding or creating new UPI accounts. Customers can add new debit and credit cards on the checkout page | It supports UPI onboarding of new customers on the checkout page |
Frequently Asked Questions
Question: How does one configure JavaScript code to enable JS Checkout?
Answer: Merchants can find the JS code on their Paytm dashboard under developer settings in the JS Checkout tab. Alternatively, they can also refer to the Invoke Payment Page.
Here are a few sample projects for the preferred framework:
Question: Can merchants change the payment order in JS Checkout and Custom Checkout?
Answer: Yes, both checkout options allow merchants to change the order of the payment options on the checkout page.
Question: Is it possible to integrate the Custom UI SDK without extracting the Paytm user’s SSO token?
Answer: Yes, merchants can invoke the Paytm app for wallet transactions. It does not require an SSO token. Refer to the app invoke method explained in the Custom UI SDK Integration document.
Question: Can Custom UI SDK integrate with hybrid platforms?
Answer: Yes, it can integrate with apps built on hybrid platforms. Click on this link for methods to integrate with React Native platform, and for integration with the Ionic Cordova platform, click here.
