Configuring Braintree Iframe Integration

TABLE OF CONTENTS

Introduction

Navigate to: Dev Center > Payment Methods

The Braintree Payment method is integrated directly into Znode. It reduces the application’s dependency of sending the payment information to the gateway making Znode furthermore efficient and secure.

Steps to set up Braintree into Znode

Step 1: Navigate to Admin >> Payment Method in the Znode admin application

Step 2: Click on Add New to create a new Payment Method.

Step 3: Select a Credit card as the Payment Type and add the required inputs for the other fields under General Settings.

Step 4: Select Braintree as the payment gateway and add the required inputs for the other fields under Merchant gateway settings.

Settings for Braintree Payment Gateway

Field

Description

Select a payment type

Type of Payment for which the Payment Method needs to be created.

Payment Code

Unique code identifies the Payment Method

Payment Display Name

Name that the admin user wants to display on the checkout page.

Display Setting

If this field is checked, the payment method will be displayed on the checkout page.

Hide Billing Address

If this field is checked then the billing address form will not be displayed on the checkout page.

Display Order

This determines the order in which the Payment Method is displayed. This field accepts the only positive numeric value.

Merchant Gateway Settings

Fields

Description

Select A Gateway

Gateway for which the Payment Method must be created.


(Select Braintree)

Select Gateway Mode

Gateway modes:


Test - This can be used for testing purposes. In test mode, all the process remains the same as in live mode. The payment-related data which is entered during check out doesn't need validation.


Live - Live mode is used for the production environment. The payment-related data (e.g. Credit card details) provided on live mode needs to be valid.


Credit Card Authorization

If this field is checked then the transaction will be authorized.

Display Capture in OMS

If this field is checked then the capture button will be displayed while managing the order.

Note: After adding the Payment Method it needs to be associated with the store in order to use the newly added payment method.

Payments using Braintree

  1. Adding a new card for making payments

    1. After selecting the Braintree payment option, if no card is saved for the user account, then add the card details (an iframe section) appears along with Save this credit card for future use field outside the iframe.
      Note: Save this credit card for future use field should be displayed only for Orders which are placed or are being placed for registered users and for Quotes.

    2. The iframe loads the Braintree payment section which can be used by admin users or customers (shoppers) to add card details that can be used to make payments while placing/managing an Order or while converting a Quote to an Order from the admin application or web store.

  1. When card details are added to the Braintree iframe, a token is generated. If a user selects the Save this credit card for future use field, the last 4 digits of the card along with the token (or Account/Profile ID whatever is provided by the gateway) gets saved in Znode so that the card can be used for making future payments.

  1. Selecting a saved card for making payments

    1. After selecting the Braintree payment option, if at least one card is saved for the user account, then a section to select a saved card and another section to add the payment details appears.

  2. Administrators or customers (shoppers) can select a saved card to make payments while placing/managing an Order or while converting a Quote to an Order from the admin application or web store.

  1. The saved last 4 digits of the card and the generated token (or Account/Profile ID whatever is provided by the gateway) gets used to make payments via Braintree.

Did you find it helpful? Yes No

Send feedback
Sorry we couldn't be helpful. Help us improve this article with your feedback.