Skip to main content

BigCommerce

1. Introduction

The DNA Payments Processing Gateway Plugin for BigCommerce helps BigCommerce store owners and merchants to redirect customers to the Secure DNA Payments Processing Gateway when customers opt to pay for their order using DNA Payments!

The aim of this document is to explain the procedure of installation and configuration of the plugin on your website. Please be very careful and pay close attention to ALL details in this document as if any one of them is misconfigured, it may cause issues.

2. Requirements

In order to use the DNA Payments Processing BigCommerce plugin, please ensure that you meet the following requirements:

  1. You must have an active​ and fully approved​ DNA Payments Processing Account with DNA Payments Processing​. If you do not have a merchant account yet, feel free to contact our Customer Support at support@dnapayments.com. If your account is still pending approval, you will need to wait before installing!

  2. Please ensure that you have the credentials detailed below:

    • Client ID - ID issues by DNA Payments for each live merchant.
    • Client Secret - Secret issued by DNA Payments for each live merchant.
    • Terminal - Live terminal number issued by DNA Payments - unique to each merchant site.

Should any of the above details be missing please contact DNA Payments.

3. Installation

Once you have met all the above requirements and you have your API credentials, you’re ready to install! Please follow all the steps below and you will be taking payments in no time.

Step 1: Login to your BigCommerce Store

Login to the administrative portion of your BigCommerce Store by visiting BigCommerce’s website or your store’s administrative panel. If you are unsure how to do this, please consult BigCommerce’s instructions, FAQ, or Support Helpdesk!

Step 2: Install the DNA Payments App

  1. Click Apps

Select App

  1. Click Marketplace

Select marketplace

  1. Search or browse to locate DNA Payments, and click the DNA Payments logo.

Select dnapayments

  1. Agree to the BigCommerce terms and click Confirm.

Install confirm

  1. Input your DNA Payments credentials, and click Submit. The credentials must be valid. Otherwise, you will not be able to log in.

Enter credentials

Step 3: Configure the DNA Payments App

After installing the app, you will see the Dashboard page where you can configure your payment method and view order details.

App details

  1. Displays your Client ID. By clicking on it, you can edit Client ID.

    Edit Client ID

  2. Displays your Client Secret. By clicking on it, you can edit Client Secret.

  3. Displays your Terminal ID. By clicking on it, you can edit Terminal ID.

  4. In the Payment Options block, you can change Transaction type.

    • Capture on order placed - A transaction is settled automatically after the successful payment.
    • Capture on shipment - A transaction is settled after you click the Settle button in the Action column in the Order Details table, or when you change the BigCommerce order status to Shipped. Order status change
  5. By switching the Checkout toggle you can show/hide the DNA Payments payment button in the Payment section on the Checkout page Payment button

4. Custom payment button

You can skip this section if you are satisfied with the default DNA Payments payment button in the checkout page. Otherwise, click the Custom Payment Button button in the top right corner of the Dashboard.

Custom payment button

It will open the page where you can customize the DNA Payments payment button.

Custom payment button details

  1. CSS selector of the HTML element in the Checkout page where the DNA Payments payment button will be placed after. You can change the position of the DNA Payments payment button, but we do NOT recommend it.
  2. CSS styles which will be added to the DNA Payments payment button in the Checkout page.
  3. By selecting the checkbox, you can enable or disable the changes described in the above 2 items.

In order to save the changes, you must click the Save button. By clicking the Reset button, you can restore the default settings.

5. Order Details table

When you click the Order Details button or View all link in the top right corner of the Dashboard, it opens the Order Details page where you can see all orders, settle or refund orders.

If Capture on shipment is selected in your Payment Options, then after a successful payment there will be the Settle button next to the order to settle the payment.

Next to the settled orders there will be the Refund button to refund a payment.

Order Details