Guide to Implement a Payment Gateway into an E-commerce Website

by Anna B.
by Anna B.
Business Analyst
21 Aug 2020
Reading Time: 12 minutes

With current consumer traffic it is nearly impossible to process payments manually. The user would rather leave the site than wait for the order. That is why online merchants are increasingly using a payment gateway. It is a modern solution that lets online stores accept funds from anywhere in the world. Such a system verifies client information and sets secure money transfer. It also helps sellers reduce processing time and boost the number of transactions.


If you want to add online payment in website, you’ve come up to the right place. In this post, we will discuss the way and price of e-commerce payment gateway integration.



What is a payment gateway?


A payment gateway is a technical solution that enables accepting debit and credit cards on websites and in mobile apps. This gateway is the link between your shop and the acquirer. It is an obligatory tool for handling any type of online payments.


A payment gateway is in charge of the secure transfer of payment information between the buyer, the merchant, and the acquirer. It uses advanced encryption to protect buyer’s private data, such as the card number.


The payment gateway may be provided by a bank or a specialized finance company – a payment service provider. Today, many providers cover different transaction types, volumes, and currencies. This post will explain how to include payment gateway in website and which provider to select. Also, it will shed light on the feasibility of making a gateway from scratch.



How does a payment gateway for e-commerce website work?


The operating scheme of the payment gateway is rather simple. When the customer places an order, the payment goes through the next steps:


  1. Purchase. The buyer picks a payment method and enters basic information at the checkout page.
  2. The data goes to the payment gateway. The system receives the information entered by the buyer and hidden fields – store ID, order number, etc.
  3. The gateway requests authorization by contacting the merchant bank and the international payment system (IPS), such as AmEx, Mastercard, or Visa. The latter confirms or denies the card validity.
  4. If the transaction falls under the 3DS protocol, the client will have to confirm the purchase with a password or biometric.
  5. The issuer notifies IPS, verifying data validity. IPS contacts the acquirer and permits to conduct the transaction.
  6. The acquirer gets the amount to be debited from the gateway. The issuer checks whether the buyer has sufficient funds, sends the sum in question, and contacts IPS to confirm the purchase.
  7. The acquirer and payment gateway receive approval and conduct payment. The seller sees that transaction went successfully. The money goes from the client’s to the seller’s account.


Such a system gives a high level of security and a low risk of fraud. The main thing is to make the correct integration of the e-commerce website with payment gateway.



Payment Gateway working scheme


Picture: Payment Gateway working scheme



Reasons to use a payment gateway for your e-commerce business


The main reason for integrating payment gateway is simple. There is no other way to handle online payments in the e-commerce shop. This is it, either you integrate a gateway or use archaic payment methods. I really wouldn’t recommend the latter, as according to Braintree, 50% of buyers leave the shopping cart if they fail to find a preferred payment method. Definitely, you shouldn’t lose that much of your potential profit.


Besides, the payment gateway brings many extra benefits. They are the following:


High security


The priority task is setting a secure environment. Acting as an intermediary between the seller, the buyer, and the bank, the payment gateway bears full responsibility for the protection of sensitive data. Below are the mandatory criteria the gateway must comply with:


SSL. It is a protocol that establishes a safe connection between a client and a server. Using asymmetric encryption, it protects cardholder’s data and transaction details.


PCI DSS. It is a rulebook for institutions that deal with bank cards. There are 12 detailed requirements for guaranteeing the security of cardholders’ data.


3-D Secure. It is one more protection layer that aims to prevent fraud and malicious attacks. 3DS transactions verify user identity by asking to enter a password or biometric data.


Simple integration


There are many providers for any taste and budget. So, it is not a big deal to embed a ready gateway into your website even though specific programming skills are mostly required. For all that, an experienced developer can accomplish this task in a couple of days.


It’s fair to say that simplicity will take place only if you deal with an off-the-shelf solution. If you choose to build a payment gateway from scratch, you will have to spend a lot of time and effort, not to speak of expense. In this post, we mainly consider how to add a payment gateway to a website using a provider. Yet, we will touch upon a subject of custom development and see when it may be wise.


If you are not sure which solution is the best for your project, please contact us. We will help you make the right choice.



Smooth user experience


A payment gateway is a fairly common thing that many users have already been familiar with. Thus, they will not hesitate to checkout after clicking the online payment button. Next, the gateway does everything by itself. We have earlier described the steps of payment processing in the previous section. The cool thing is that all these actions occur within 2-3 seconds. Hence, after placing an order, the user receives payment confirmation almost instantly.



Payment gateway transaction types


In this section, we will look through the primary transactions that a payment gateway performs. Each transaction is directly linked to buying and selling, regardless of the type of the product. So, there is a reasonable chance that your e-commerce platform would need all of them in place. Thus, if you want to integrate credit card payment on website, you will have to check whether the gateway of choice carries out a particular type of transaction.



Authorization does not imply direct money transfer. Instead, the system checks whether the buyer can complete the purchase – that is if the buyer has sufficient cash available in the relevant account. Such a transaction is beneficial for sellers who cannot send goods immediately. It helps ensure the client will pay once the item is shipped.



This transaction works in tandem with the previous one. It enables you to catch money that was authorized before. Note, the money is not yet in your pocket on this step. It arrives in the bank’s account after being captured.


The full chain of events looks like this. The buyer places an order – the money is being authorized. You ship an item – the money is captured and redirected to the settlement.



The sale is the authorization and capture in one package. During the sale, the funds are charged and sent simultaneously. It is vital for merchants who work with intangible goods, as they need to give the product at once after payment. For instance, if the user buys a gym membership, he or she wants to immediately get a virtual entry card.



If you don’t guarantee a refund, you risk losing a lot of customers. Buyers should be confident in the quality of goods. If you offer easy money back, the brand’s credibility is growing. Therefore, the refund transaction is a must-have for any seller, regardless of what product they sell. The refund is bound to the authorization’s amount of money and is available for capture and sale transactions.



It’s a kind of revoke authorization since the transaction implies sending back the authorized money. Note, if the funds were captured or sent to a bank account, they could not be voided. Instead, they should be refunded.


The void is technically easier than a refund because the system does not need to withdraw money from one account and return to another. That is why the void transaction is cheaper, yet, not all gateways support it.



Choosing an e-commerce payment gateway type and provider


Now that you’ve learned some basics let’s see what’s actually in the market. If you want to integrate payment gateway in website, you should first understand what kind of provider you need. Today, the majority of gateways fall under two categories: hosted and non-hosted solutions. They differ by the way of handling the transaction and the level of responsibility. Let’s find out more.



Choosing an e-commerce payment gateway type and provider



Hosted solution


These gateways redirect the user to the provider’s site at the time of the purchase. When the user clicks the “pay” button, they go to the provider’s page, enter card details, and confirm the payment. Upon completion, they get back to the seller’s site.


On the one hand, this operation mode is handy for the merchant because they break free of processing the buyer’s financial data. It is the payment gateway that handles the cardholder’s sensitive information and is in charge of the operations security.


On the other hand, this method may bring poor user experience and breed customers’ mistrust. Besides, you lose control over the transaction flow and entirely rely on a third-party service.



Non-hosted solutions


Such gateways carry out the payment procedure on the e-commerce store page. Users don’t need to jump anywhere. All actions are done in one place.


The non-hosted solutions bring excellent user experience and grow brand reputation. Making quick payments within the site, users feel they are dealing with a reliable company.


The bad thing is that you should set up many security points by yourself. Since the card data is stored on your server, you should guarantee secure data storage, anti-fraud measures, and PCI-compliance.



Examples of hosted payment gateways


In this section, we will look through the most popular gateways that set up highly secure transactions and perform payments beyond the seller’s website.


PayPal Express

According to the Datanyze study, PayPal is the most in-demand payment provider. It occupies 18% of the market and serves more than 400 thousand sites around the globe. PayPal Express takes the user from the store page and handles the checkout on its own side. It is a low-cost option which is more suitable for beginners or small merchants. The more transactions you have, the less fee you pay.

Inserting PayPal to the website is fairly simple. You just need to insert the js.script and customize the way buttons look according to your needs. Find out more about the integration in the PayPal guide.


PayPal Express fees

  • Monthly fee – none
  • Transaction fee – 2.9% + $0.30 (it may be as low as 1.9% + $0.30 per sale)
  • Setup fee – none



PayPal Express flow


Picture: PayPal Express flow



Stripe is a large provider that has a developed technical infrastructure for accepting online payments. It is installed on more than 100K e-commerce stores and crowdfunding platforms. On the list of the most famous clients, there are Shopify, Kickstarter, Twitter, and Pinterest.

Stripe offers plenty of  tools for developers and a smooth integration process. It is highly customizable and fits any kind of business. Merchants choose Stripe because it is reliable, cross-functional, and adaptive. See Stripe’s official docs to find out more about this online payment gateway integration.


Stripe fees

  • Monthly fee – none
  • Transaction fee – 2.9% + $0.30
  • Setup fee – none



Quick checkout option using Stripe Checkout pop-up


Picture: Quick checkout option using Stripe Checkout pop-up


Amazon Pay

Amazon Pay is one more popular provider that enables payments processing on the website. It is convenient for users who have an Amazon account because hey avoid the step of entering credit card details during the purchase. The user simply logs in with account credentials and proceeds to checkout. Unlike two previous providers, Amazon does not redirect the buyer from the store site. Since it is not wholly a hosted solution, it allows users to close the payment in one place.

Amazon Pay is available for e-commerce platforms and custom shops. In the former case, you will need to install a special extension, and in the latter one, integrate using the Amazon API.


Amazon Pay fees

  • Monthly fee – none
  • Transaction fee – 2.9% + $0.30
  • Setup fee – none



Log in to Amazon account to pay without entering credit card details


Picture: Log in to Amazon account to pay without entering credit card details



Examples of non-hosted payment gateways

Now, let’s see which providers offer a smooth user experience by enabling the whole purchase procedure on the seller’s side.


PayPal Pro

PayPal Pro suits advanced merchants who want to offer their customers a variety of payment options. With this gateway, you can accept debit and credit cards, instant payments, and recurring payments. The last ones require additional settings, though. You can also work with several currencies, including the US Dollar, Euro, and GBP.

To integrate the pro version of PayPal, you should use a specially designed API. The step by step guidance is available on the official website.


PayPal Pro fees

  • Monthly fee – $30
  • Transaction fee – 2.9% + $0.30
  • Setup fee – none



PayPal Pro checkout


Picture: PayPal Pro checkout




Authorize.net is one of the oldest and most popular payment systems in North America that accepts bank cards and supports payments via Apple Pay, Visa Checkout, and PayPal.


Authorize.net delivers an easy buying process with the help of a CIM solution. The latter stands for Customer Information Manager and stores the cardholders’ data on the secure server using tokenization. It enables the user to make subsequent payments without the need to enter payment details again. For example, repeating buyers can find the card number and shipment information in their accounts and use them again.

To add Authorize.net gateway to your online store, use their official guide.


Authorize.net fees

  • Monthly fee – $25
  • Transaction fee – 2.9% + $0.30
  • Setup fee – $49 for merchant account



Authorize.net payment methods


Picture: Authorize.net payment methods



FirstData is a big American company that deals with credit card processing. It has six million sellers and controls 45% of all US credit and debit operations. FirstData offers multiple payment options. Among other things, you can enable subscriptions, one-time payments, and pre-orders. The service works with 140 currencies worldwide.

Adding the FirstData gateway is not complicated; however, the coding skills are required. You can create a SandBox account and test how the payments go before launching it on the live site. Find out how to integrate a payment gateway into an e-commerce website in the FirstData paper.



Placing an order through the FirstData gateway


FirstData fees

  • Monthly fee – $20
  • Transaction fee – variable depending on volume
  • Setup fee – variable


FirstData fees


PayPal Express Stripe Amazon Pay PayPal Pro Authorize.net FirstData
Payment methods Credit card or Visa Debit card, PayPal balance, bank account Debit and credit cards, e-wallets, local payment methods Debit and credit cards, Amazon.com cards Debit and credit cards,bank account, PayPal account, rewards balance Credit cards, signature debit cards, e-checks and digital payment solutions Debit and credit cards, electronic checks, gift cards
Supported credit/debit cards Visa, Mastercar, American Express,  Discover,

JCB, Diner’s Club

Visa, Mastercard, American Express, Discover, JCB, Diners, Club China, UnionPay Visa, Mastercard, American Express, Discover, Diner’s Club, JCB, NYCE, STAR, China UnionPay Visa, Mastercar, American Express,  Discover,

JCB, Diner’s Club

Visa, American Express, China UnionPay, Diners Club, Discover, JCB, Mastercard Visa, MasterCard, Diners Club, American Express, Discover
Monthly fee none none none $30 $25 $20
Transaction fee 2.9% + $0.30 (may go as low as 1.9% + $0.30 per sale) 2.9% + $0.30 2.9% + $0.30 2.9% + $0.30 2.9% + $0.30 variable depending on volume
Setup fee none none none none $49 variable



Considering building custom payment gateway


If you are not satisfied with the existing providers, you can consider making a custom gateway. This option is suitable for large merchants with a huge turnover, since such a venture is not cheap, to put it mildly. With your own gateway, you get the following benefits:


  • Full control. You do not depend on a third-party service and do not pay an external company for each transaction.
  • Customization. You get a service that is 100% tailored to your business needs.
  • Additional revenue. You can use your gateway to earn extra money by acting as a payment provider.


The drawbacks of custom development are time and money. See what I mean below:


  • Development time and costs. To develop a payment gateway, you need to choose a payment processor, which is a bank or a payment system. Then, you will need to study their documentation and connect to them using their API. Next, you will need to make your own API, which you will provide to your clients (other merchants). Merchants will send payments for processing through your external API and receive payment statuses in return.


  • Certification time and costs. After you have developed the software, you need to obtain an EMVCo license and apply for PСI DSS-compliance. Both procedures require careful preparation and cost a lot. For example, the EMVCo license will cost you €40K, and an annual PCI audit – $25K.



Step-by-step process of e-commerce payment gateway integration


If you decide to use a ready-made gateway, the integration will be quite quick and straightforward. Usually, it takes not more than a few days.


If you choose a hosted gateway, in most cases, you just need to copy and paste the piece of the code that will place the “Buy” button on your site. All further actions will take place on the provider’s side.


Step-by-step process of e-commerce payment gateway integration


If you opt for a non-hosted solution, you may need coding skills to set up servers and make the following adjustments. Here is what you will have to do:


  1. Select a gateway
  2. Study their documentation
  3. Make sure your website hosting supports the required functionality. You need software for such programming languages as Visual Basic.Net, PHP, Perl, CGI, ASP.Net, ASP.
  4. Add the necessary script, test the work, and launch new functionality to the production environment.


If you want to add payment method in website without redirecting to the provider’s page, you must go through a PCI DSS security scan to reduce the risk of fraud.


If you need an experienced developer to add payment gateway to e-commerce website quickly, please contact us. Our team of developers will help you.



How much does it cost to integrate a payment gateway into an e-commerce website?


If you aim to integrate online payment into website, you should first study the providers’ fees. It is a common situation when a merchant faces hidden payments. To avoid this, carefully examine the documentation and clarify all payments in advance.


Start with registration, setup, and monthly costs. Proceed to the transaction, refund, and processing fees. These are payments that are charged by the majority of providers. In most cases, they don’t differ much, though.


Except for the main functionality – payments acceptance – the gateway may offer you a variety of extra options to meet the unique business needs. In particular, gateways can set up:


  • recurring charges for services that require a subscription
  • notifications to inform about the transaction status
  • safe data storage to let the returning buyer reuse payment details
  • developer tools to customize certain features
  • linking with third-party services, such as shopping cart or accounting tools


If you hire a developer to integrate a payment gateway into the website, you should also add this sum to the total. All in all, the price will depend on the provider’s fees and set-up costs.



Final thoughts


A payment gateway is a must-have for merchants who want to accept online payments on the website. Today, many payment providers offer out-of-the-box solutions. Your task is to choose a suitable provider and integrate the payment gateway into the site.


Consider choosing hosted solutions if you want fast and easy integration with no responsibility for security measures. Think of a non-hosted gateway, if you’re going to deliver an excellent UX and have full control over the transactions. Choose custom development if you want to sell your gateway to other merchants.

At JoinSoft, we work with all-sized e-commerce businesses. So, if you are not sure how to integrate payment gateway in website, get in touch. We will guide you in the right direction.


Rate this article!

Average rating 1.5 / 5. 43

No votes so far! Be the first to rate this post.

You may also be interested in
custom software development benefits1
The market of development tailored applications for businesses has reached an overall value of 389,86 billion...
by Anna B.
16 Jun 2021
Software Development Process
Software constitutes a premise for a great lot of indispensable things in our lives. From personal computers, cell phones and tablets to the Internet of Things and databases - this is...
by Valeriia P. & JoinSoft Team
07 Jun 2021
front-end development steps
A web-based product consists of two parts: the one visible only to developers and the one that users see in their browsers and directly interact with. The functionality depends on the firs...
by Anna B.
18 Jun 2021