Scribd
Upload
10 views

How to add UPI payment gateway in Ecommerce - content

This document provides a step-by-step guide on how to add a UPI payment gateway to an e-commerce website using a WordPress plugin. It details the installation and setup process, including configuring settings to streamline the payment experience for customers. The guide concludes with instructions on testing the payment process and managing order statuses in WooCommerce.

Uploaded by

s.gopal1993.6
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
10 views

How to add UPI payment gateway in Ecommerce - content

This document provides a step-by-step guide on how to add a UPI payment gateway to an e-commerce website using a WordPress plugin. It details the installation and setup process, including configuring settings to streamline the payment experience for customers. The guide concludes with instructions on testing the payment process and managing order statuses in WooCommerce.

Uploaded by

s.gopal1993.6
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

Hi guys!This is Gopal from Website Learners.

com Today I am going to show you, how to add


UPI payment gateway to an E-commerce website from start to finish.

Okay!So before we start, let's check our product checkout page.Here it is.After watching this
video,you will be able to add UPI payment gateway to an E-commerce website, which will make
the payment process fast and more secure.By adding this feature to the website will make
payment super convenient.

So let’s get started. Before we do that, let’s check our product checkout page.

The 1st part is to go to product checkout page.

The 1st step is to go to your product page.


The 2nd step, is to select the product.
Select the product you want to add to cart. So, i’m going to click on this product and click on add
to cart
The 3rd step, is to click on ‘add to cart’.
The 4th step, is to select ‘check out’.

Once clicking on ‘check out’, you will be redirected to next page which asks you to enter your
billing details.

When you scroll down, you can see that there is ‘no payment options available.

Add UPI payment gateway.

So, let’s add UPI payment gateway.it's going to be very simple. We’re going to add UPI payment
gateway in 2 parts.

Step - 1: Add UPI payment gateway.

So to add UPI payment gateway to an e-commerce website, we’re going to do 2 steps.

The 1st step, is to Install UPI plugin.

So to install plugin to the website, go to your wordpress dashboard.


So now on the left side you will be able to see an option called plugins.
we need to install a new plugin.
Goto plugins section in the dashboard and select add new. Search for “UPI QR code” in the
search box that appears on the right. You can see there are lots of plugins available.
Install and activate the plugin by ‘Team Knitpay’.
Click on install now.Once it get installed,click on activate.
Now, to check whether the plugin is installed or not. Goto ‘plugin’ and select ‘Installed plugins’.
You can see all the installed plugins. Okay so now UPI QR Code Payment Gateway plugin is
installed successfully! and we can now setup the UPI plugin. Setup UPI plugin.

Now, we’re going to set up the UPI plugin and change a few settings which will make the
payment easier.

Click on the ‘setting’ option under the plugin.

Make sure the first option ‘enable/disable’ checkbox is enabled, just scroll down this page and in
the ‘payee UPI address(VPA),click on the drop down and select ‘hide field’ and in the ‘require
UPI ID section, select 'don't require field’.

So, changing these two settings will make the checkout process easier for the customer. It will
‘remove’ the ‘UPI address’ field from the checkout page where customers enter their UPI
address to complete the payment.

Just scroll down this page, under the payment popup settings, enter your store name in the
‘your store or shop name’ field. Enter your merchant UPI ID in the ‘merchant UPI VPA ID’ field.

So to get the UPI ID, open your ‘google pay app’, click on your profile in the top right corner,here
you can get your UPI ID, enter this UPI ID in the ‘merchant UPI VPA ID’ field.

In the ‘UPI transaction ID’ field, click on the drop down and select ‘hide fields’ to make the
payment process easier.

It will remove this ‘12-digit transaction ID’ field from the payment page where customer enter
their UPI transaction ID number.

Just scroll, in the payment button option, click on the ‘show/hide payment’ checkbox.

This will enable direct payment button on mobile devices.

To remove this QR code on mobile devices, in the ‘mobile QR code’ uncheck ‘show/hide QR
code’.

Just scroll down, click on ‘save changes’, now go back to your checkout page and refresh the
page. Now you can see the payment option is now available’.

Now, let’s test it out. Let’s enter our contact information and shipping address, click on ‘proceed
to payment’, scan this QR in your mobile and make a payment.(let’s try doing it using our
mobile), once scanned the QR code, after making the payment, click on ‘proceed to next’,
customer needs to ‘upload the screenshot’ of the transaction. Select on ‘choose file’, upload the
screenshot and click ‘continue’.
The order has been successfully placed. Both the owner and customer will ‘receive an email’
about this order.

Customer will receive an email like this which says the order is ‘on-hold’, once you received the
amount, you ‘need to change the order status’.

To ‘change the order status’, let’s go back to our wordpress, Goto Woocommerce and select
orders. Here, you can check the orders and it’s status. Click on the order. In the next page, if
you scroll down, in the right side under ‘order notes’, you can check the ‘transactional
screenshot’. Click on it and once you verified the payment, go back to the order page, in the
status section, change the status to ‘processing’ and click on ‘update’.

Now, the customer will receive another email which says the order is ‘now being processed’.

Now, let’s see how it works on the mobile devices

Follow the same procedure that we did before, select a product, click ‘add to cart’, click
checkout, enter billing details, select ‘proceed to payment’, click any of these payment app.So
thanks for watching, I'll see you in the next video.Bye Bye.

You might also like