How to integrate a payment gateway into a website: Full roadmap

Payment gateway integration in websites had long become a necessity rather than a handy yet surplus addition back when credit cards were less prevalent. Customer safety and convenience are currently the number one priorities, which means you should opt for adding an easy, hassle-free, and secure payment system to your online business as soon as possible. 

Modern payment solutions have to tackle many issues – from minimizing cart abandonment to being helpful and less invasive by carefully guiding the customer to the desired outcome. First and foremost, it comes down to choosing both the right type of gateway and a suitable provider to create that happy medium of what you want and what your customer needs. Second, the integration process itself. 

Our team at DICEUS is here to guide you through all these points to ensure you make a successful payment integration that is also a right fit for all your business requirements. 

Discover our IT services for retail.

What is a payment gateway?

Simply put, a payment gateway is an online service that warrants the money exchange between a retailer and a customer in both brick-and-mortar stores and e-commerce. Being such a basic need in every online purchase, it is a staple in building any new e-store. A correct payment gateway transaction should have relevant encryption and security protocols to protect the data coming from customers to merchants. 

There are several benefits from using a payment gateway on your e-store, apart from security. Firstly, it helps online stores get more sales that are not local and expand their customer base. Online payment for business also saves time by speeding up transactions that a bank would manually process, plus payments can take place at any time of day or night regardless of the bank’s work hours. 

Talking about the basics, we must also mention the three general types of payment gateways, each serving its own technical purpose. There are: 

Hosted payment gateways

A hosted payment gateway redirects customers to the gateway provider’s payment page for transaction completion. Once payment is made, the customer is redirected back to the merchant’s website. This method is highly secure because all the sensitive data (e.g., credit card data) is handled directly by the payment gateway provider, cutting the merchant’s responsibility for PCI compliance. 

Hosted payment gateways are simple to implement and maintain, with encryption and security handled by the host, i.e., the service provider. They are better suitable for small and medium-sized businesses that do not seek in-depth customization. One nuance, however, is that customers must leave the merchant’s website during the transaction, which can interrupt the shopping experience (discussed in more detail below). 

Popular examples of hosted gateways include PayPal and Stripe Checkout. 

Direct post payment gateways

A direct post payment gateway allows customers to input their payment information directly on the merchant’s website, but the transaction itself is processed through the gateway provider’s backend systems. This option strikes a balance between security and simple integration with the e-store’s design. 

Transactions appear integrated with the website, granting a more wholesome shopping experience. The merchant avoids storing sensitive customer data, reducing security risks. However, on the flip side, direct post solutions require extra PCI compliance. 

Direct post is ideal for businesses that want to maintain full control over the user interface without having to handle sensitive data directly. 

Non-hosted payment gateways

A non-hosted payment gateway keeps the entire payment process on the merchant’s website, offering full control and customization over the transaction experience. Merchants process payments directly (which calls for extensive security efforts and full-on compliance with PCI standards). 

A non-hosted gateway grants a seamless, uninterrupted shopping experience, improving customer satisfaction. It also enables merchants to customize the payment interface entirely to match their brand identity. Such solutions, however, are more complex and costly in their integration implementation, with the merchant taking responsibility for securing sensitive payment data (discussed in detail below). 

Non-hosted gateways are typically used by large businesses or enterprises that require a tailored, fully branded checkout experience.  

How does it work?

As the name suggests, a payment gateway is an opening (a gate) for a subsequent payment journey. Here’s the structure of the core transaction flow: 

1. A customer confirms the order by clicking the “purchase” button and heads over to the checkout page, where they submit their credit card information. 
2. The web browser on the customer’s side encrypts the data using the TLS or SSL connection. It sends it to the merchant, who, in turn, uses another encrypted channel to pass the data over to the payment gateway. 
3. The payment gateway then redirects the secure information to the bank’s payment processor (a company that offers third-party payment processing), which then goes to a card network – Visa, Mastercard, Discover, or American Express. 
4. The network verifies the data and sends it on to the cardholder’s bank if it’s correct.   
5. The bank either accepts or denies the authorization request and sends back a code consisting of transaction success status to the payment processor.  
6. At this point, both merchant and a cardholder are aware of the status when it goes through the gateway again and back to the website. 
7. Consequently, the credit card company transfers the funds to the seller if the payment is authorized. 

Basic transaction types

When accepting payment on a website, there are a few types of credit card transactions processing you might encounter. Here are the main ones: 

• Purchase – the most common type characterized by asking the bank for authorization to accept the payment. 
• Authorization means checking if the customer does have the means to pay for the order, and if he does, the money is temporarily blocked. 
• Capture is marked by the actual processing of confirmed payment and the merchant receiving the money. 
• Void means calling off the previously authorized but not captured transaction if the order is canceled. 
• Refund – the process of returning the money back to a customer by a merchant after that money has been fully received after the capture transaction. 
• Chargeback happens when a customer requests the bank post-transaction to receive the money-back when there’s been fraud or other problems with the order. 

Learn more about payment gateway integration services.

Security in online payments

E-commerce businesses have to be extremely diligent in protecting their customers’ personal data. Besides the standard two-factor authentication method, they can also do that by using the following solutions: 

• TLS (SSL) certificates – the Transport Layer Security protocol (earlier Secure Sockets Layer) allows encrypting transmitted data using symmetric keys. The easiest way to see if the website uses it is if it has HTTPS in its URL. 
• Payment Card Industry Data Security Standard – PCI DSS Compliance offers secure payment solutions by appointing several requirements and guidelines, such as verified software, firewall, transmission encryption, etc. 
• Tokenization means issuing a temporary code or token to conceal a credit card number. 
• Secure Electronic Transaction – a much older protocol used to develop SSL and other security certificates. SET helps maintain the integrity of data transmissions by preventing access to any sensitive information. 

How to choose a payment gateway

There are two payment gateways available today – hosted and non-hosted (or integrated). The former is the ready-made solution offered by online payment gateway providers, whereas the latter has to go through an integration process. 

Hosted solutions 

The hosted gateway sends the customer from the checkout page to another web processing platform to finish the payment and then back to your page after it’s complete. If choosing a hosted solution, make sure to go through a well-known service to minimize the unfamiliar feel. 

The most favored solutions are PayPal, Amazon Pay, Stripe, and SagePay (now Opayo). This option suits smaller businesses more since it has fewer fees. 

Pros 

From a merchant’s standpoint, it is a pretty simple process – the solution is cheaper and requires less time to get it set up and running. However, using third-party services and their resources also means not adhering to security protocols as the providers have it covered. 

Cons 

The additional steps and jumps can be slow and potentially annoy the customer, especially if the service provider is unfamiliar. Another con is that some providers allegedly keep your customer’s data after discontinuing the contract. 

Integrated solutions 

This solution means integrating payment API for the website and having it stay on your checkout page by connecting you directly to the gateway. As a seller, you are responsible for providing a smooth, safe, protocol-compliant payment process. The integration process is also a bit more complex and, even with ready-made tutorials, still requires some knowledge about web development. 

The most popular integrated gateway providers are Authorize.net, SagePay Direct (now Opayo), Mango Pay, PayPal Pro, and BrainTree. 

Pros 

The retailer has complete control over all payment transactions. The personal data of all the customers is never handed over to the third party, which is great for medium to large businesses with an extended client base. The store can also customize the complete checkout process and make it more user and mobile-friendly. 

Cons 

In this case, stores have to follow all the strict security rules themselves without additional help, which adds to the overall cost. And finally, the store website’s architecture has to be able to uphold the provider’s features. 

What to look for when selecting a provider

Selecting a simple payment gateway comes down to a few key factors depending on your business type, your customers, and other internal and external factors. 

Cost 

Cost depends on your total turnover since all services request a fee for using their tools. The most popular types of payments are per transaction, per month, and for gateway installation or account setup. Some charge additionally for refunds and chargebacks. The fee percentage may range from 2% to 4%. Take a look at some of the pricing plans – PayPal, Stripe, or Authorize.net. 

Limits 

Check for a maximum and minimum transactions amount that a provider can handle and decide according to your business size and price of items. For example, if a company is not selling houses or something equally substantial and expensive, an average maximum capacity is enough. 

Payment options 

Even though credit cards still hold the title as the most popular payment method, PayPal, Union Pay, mobile payments, such as Google Pay, Samsung Pay, and Apple Pay, are so widespread that it’s not wise to discard them. The same goes for international currencies support.  

Take a look at the four popular providers’ features and fees comparison. 

How to connect a payment gateway into a website

After you’ve chosen your provider and a suitable gateway type, the next step in your journey to add a payment method in the website is signing up for a merchant account. The rest depends on the chosen method.  

Our team at DICEUS also provides integration services, combined with consulting, audit, maintenance, and custom development. Now let’s take a look at some of the steps more directly. 

Payment card industry data security standard

The previously mentioned PCI DSS is the key ingredient to making your payment process as safe as possible. To comply with this standard, you must first determine your compliance level out of four available, based on the number of transactions your business has previously handled.  

Then after poring over this Self-Assessment Questionnaire, you have to complete an exam that has nine different versions depending on your business type. Next goes the External Vulnerability Scan by the Approved Scanning Vendor, after which you present your documents to the bank. 

Hosted payment gateway integration

Hosted gateway method prompts the merchant to connect their e-store straight to the gateway and obtain an SSL certificate while also getting the gateway’s credentials, including the merchant’s ID, MWS access key, and a secret key.  

Usually, you can get detailed guidelines on integrating a hosted solution on each provider’s website. For example, here are the overviews of the few providers’ methods. 

PayPal 

To integrate PayPal, you need to add and customize a Smart Payment Button. Suppose you need to sell a single product or service at a fixed price – head here. For multiple items, it’s better to assemble PayPal Checkout – this doc for developers can guide you. 

Before adding the Button, check if you have a business account. Then, in the “Tools” section, you can create a new button, as shown in the picture. After following the instructions that ensue, you’ll get an HTML code you can use anywhere on the website. 

Stripe 

Stripe is both PCI-compliant and supports all main credit card options. Follow this link to find full Stripe checkout documentation that will help you create a secure payment page or this link for Web Elements. And here you can explore how the Checkout looks and feels for either one-time payments or recurring ones. 

Amazon Pay 

Another excellent option is Amazon Pay – it blends organically into your website and, unlike other hosted options, doesn’t redirect a customer entirely away from your store. First, you need to create a business account, then a buyer account to test the integration in a Sandbox environment. You should be all set after getting the certificate and credentials we mentioned earlier. 

Non-hosted integration

To integrate credit card payment in the website in a non-hosted way, you need to connect the gateway to your server through an API. Here’s a brief outline of the Authorize.net and Opayo (SagePay Direct) integration methods. 

Authorize.net 

One of the oldest payment gateway providers, Authorize.net, can also be integrated by accessing its API through a sandbox account with merchant authentication. You can create the account here. Another option is to look for modules and extensions available on the Internet. 

SagePay Direct (now Opayo) 

With Opayo Server integration, the e-store does not need to collect payment data – the gateway provider handles everything.  Check here for the API Reference section and the companion guide for shared API. 

Custom 

A larger business might be interested in a custom payment gateway. Although the cost of development can range from $150,000 to $500,000 or more, the benefits of customization and not depending on fees can be pretty appealing. Less costly might be turning to an open-source solution, such as OmniPay.

DICEUS expertise in payment gateway integration

DICEUS is a leading IT software consultant and development provider offering various digital customer payment solutions that grant users convenience and drive ROI for merchants.  

With a proven track record in delivering custom payment gateway solutions, DICEUS enables businesses to start accepting payments and provide convenient, secure, and efficient customer transactions.  

You can leverage various payment gateway services, from consultation and planning to development and post-implementation support.  

What sets DICEUS apart? 

• In-depth expertise. Our specialists have extensive experience integrating leading payment gateways like PayPal, Stripe, and Square and custom-built solutions. They are also seasoned in delivering tailored solutions for eCommerce, fintech, retail, and other industries.
• Security-first approach. We prioritize compliance with PCI DSS standards for guarding sensitive payment details and constantly work on encryption protocols to protect transaction details against fraud attempts and new cyber threats. 
• Customized solutions. Get hosted, non-hosted, and integrated payment systems built to match your business model and brand identity, boasting the support for multi-currency and multi-language payment options to cover even global audiences. 
• End-to-end support. We provide consultation and strategy development for selecting the right payment gateway solution, backing things up with ongoing maintenance and support for uninterrupted payment processing. 

Turn to DICEUS for a combination of technical expertise with a customer-focused approach, and get the most out of transactions! 

Frequently asked questions