LogoLogo
  • Introduction
  • Quick Start
  • User Management
  • Card Management
  • Address Management
  • Payment Processing
  • Account Secuirty
  • Payment Security
  • Glossary
  • How to Integrate
    • WooCommerce
    • Magento
    • Custom System
Powered by GitBook
On this page
  • Step 1: Set up your Merchant Account
  • Step 2: Add script to your store
  • Step 3: Integration Set-Up
  • Step 4: Enable the checkout process
  • Step 5: Testing and Finalization
Export as PDF
  1. How to Integrate

Custom System

PreviousMagento

Last updated 1 year ago

Krepling Pay's custom integration guide is tailored for merchants who have developed their own e-commerce website and seek to streamline the checkout process for their customers while minimizing cart abandonment.

Tip: Custom integration with Krepling Pay entails a degree of development effort to effectively handle incoming requests from Krepling Pay for processing new orders and transactions, as well as occasional interactions with Krepling Pay for tasks such as refunds. A detailed technical integration guide is provided below.

Step 1: Set up your Merchant Account

Begin by creating a new Merchant Account with Krepling Pay by heading or contacting us directly at pay@krepling.com. Once you have successfully created an account with Krepling Pay, you will receive your unique Merchant ID and Secret Key via email. These credentials will be essential for the integration process.

Step 2: Add script to your store

Copy and paste the provided script code into your store's backend. This script manages user interactions during checkout. Make sure to replace placeholder identifiers like #submit and #merchantId with the actual IDs or classes corresponding to your website's elements.

$('#submit').on("click", function () {
    var MerchantId = $.trim($("#merchantId").val());
    var SecretKey = $("#secretKey").val();
    var Amount = $("#amount").val();
    var Quantity = $("#quantity").val();
    var ProductName = $("#productName").val();
    var Size = $("#size").val();
    var Price = $("#price").val();
    var Shipping = $("#shipping").val();
    var SubTotal = $("#subTotal").val();
    var Total = $("#total").val();
    
    $('body').append(`<iframe class="merchantiframe"
        src="http://localhost:5002/Home/Checkout?MerchantId=${MerchantId}&SecretKey=${SecretKey}&Amount=${Amount}&Quantity=${Quantity}&ProductName=${ProductName}&Size=${Size}&Price=${Price}&Shipping=${Shipping}&SubTotal=${SubTotal}&Total=${Total}" name="iframe_a" title="Iframe Example"> </iframe >`)
});

Step 3: Integration Set-Up

Seamlessly integrate the script code within your store's checkout or payment section. This ensures a smooth transition for users during the checkout process.

Step 4: Enable the checkout process

When customers initiate the checkout process, the integrated script generates an iframe dynamically. This iframe loads the Krepling Pay checkout page with all the necessary parameters, including the Merchant ID, Secret Key, and product details. Users are then redirected to Krepling Pay for eventual payment processing.

Step 5: Testing and Finalization

Thoroughly test the integration to ensure a seamless checkout experience for your customers. Verify that users can smoothly complete transactions without any errors. If you encounter any issues or need further assistance, don't hesitate to reach out to our support team for help at support@krepling.com

here