Skip to main content

​
Browser Support

Spotflow InlineJS is compatible with all recent versions of modern web browsers that support ECMAScript 5 or later. This includes:

​
Supported Browsers

  • Google Chrome: Version 23 and above (all platforms)
  • Safari: Version 7 and above (macOS and iOS)
  • Mozilla Firefox: Version 21 and above (desktop)
  • Microsoft Edge: Version 79 and above (Chromium-based, desktop)
  • Opera: Version 15 and above (desktop)

​
Mobile Browsers

  • Chrome Mobile: Android 5.0+
  • Safari Mobile: iOS 10+
  • Samsung Internet: Version 4.0+

​
Unsupported Browsers

The following browsers and configurations are not supported:
  • Internet Explorer (all versions, including IE 11)
  • Opera Mini in Super Saver/Extreme mode
  • Browsers with JavaScript disabled
  • Legacy browsers that do not support ECMAScript 5

​
Recommendations

For the best experience, we recommend using the latest stable version of any supported browser with JavaScript enabled.

​
Installation

  • npm
  • yarn
  • cdn
npm install @spot-flow/checkout-inline-js
If you used NPM or Yarn, ensure you import the library as shown below: 
   // Add for NPM, Yarn
import { CheckoutForm } from "@spot-flow/checkout-inline-js";

​
Usage

​
One Time Payment

import { CheckoutForm } from "@spot-flow/checkout-inline-js";

const checkout = new CheckoutForm({});
checkout.setup({
  email: "temi@mailinator.com",
  encryptionKey: "gF1SPEMA3ido2Dg4ByXxxxxxxxxxxxxxxxxx", // The encryption key for the merchant
  merchantKey: "pk_test_8a586f9801254xxxxxxxxxxxx", // Your Merchant Public Key generated on Spotflow
  currency: "NGN", //can be in USD or in the local currency of your collection region e.g NGN, GHS
  localCurrency: "NGN", //optional and only needed if currency is in USD
  amount: 500
});

​
Subscription Payment

  const checkout = new CheckoutForm({});
  checkout.setup({
    email: "temi@mailinator.com",
    encryptionKey: "gF1SPEMA3ido2Dg4ByXxxxxxxxxxxxxxxxxx", // The encryption key for the merchant
    merchantKey: "pk_test_8a586f9801254xxxxxxxxxxxx", // Your Merchant Public Key generated on Spotflow
    planId: "7447a235-9f53-4d44-xxxxxxxxxxxxxx", // Replace with your plan ID
    currency: "NGN", //can be in USD or in the local currency of your collection region e.g NGN, GHS
    localCurrency: "NGN", //optional and only needed if currency is in USD
  });

​
One-Time Payment via CDN

Alternatively, to integrate InlineJS into your web application, you can include it directly in your HTML via a CDN. Include the following script tag in the <head> section of your HTML file: HTML 
  <script src="https://dr4h9151gox1m.cloudfront.net/dist/checkout-inline.js"></script>

 <button onclick="openCheckout()">
  Make Payment
</button>

 <script>
      const openCheckout = () => {
        const { CheckoutForm } = SpotflowCheckout
      const checkout = new CheckoutForm({});
      checkout.setup({
          email: "temi@mailinator.com",
         encryptionKey: "gF1SPEMA3xxxxxxxxxxxxx", // The encryption key for the merchant
         merchantKey: "pk_test_8a586f9801254xxxxxxxxxxxx", // Your Merchant Public Key generated on Spotflow
         currency: "NGN",
         localCurrency: "NGN", //optional and only needed if currency is in USD
         amount: 500
          }
        });
      };
    </script>