Install the package

Install the package using npm or yarn:

npm i @stringpay/sdk

Or

yarn add @stringpay/sdk

Setting up the interface

Preparing the container

Before you initialize the SDK, prepare the container where you will place the payment iframe by creating an empty div with the class "string-payment-frame". Display it within your application where it fits best with your design and flow. This element will display the credit card payment fields (cardholder name, card number, expiration date, and cvv).

<div class="string-payment-frame"></div>

Initializing the SDK

Next, initialize the SDK by calling the init() function with your options. This will return a StringPay interface, which exposes key functions for your integration.

const stringPay = stringPaySdk.init({
  env: "SANDBOX", // In a production environment, change this to "PROD"
  apiKey: "str.1709f60c62844ad1aa706bedcac5c3c7", // Your API Key Here!
});

Continue to Integration Steps