zinari-pay

Video Tutorials

Table of Contents

• Zinari Pay
  • Links
  • Features
  • Fee Structure
  • Installation
    • Using npm
    • Using yarn
  • Usage
    • Vanilla JavaScript Example
    • React Example
  • Zinari Pay CDN Integration
  • Notes
  • Known Issues
    • CORS Error
  • Happy Coding

Zinari Pay

zinari-pay is a secure and easy-to-integrate cryptocurrency payment gateway designed to enable businesses to accept crypto payments online. It supports stablecoins (USDT & USDC), offers encrypted transaction handling, and provides seamless integration for developers and business owners.

Links

• Official Website
• NPM Package
• Documentation

Features

• Accept stablecoins payments: USDT & USDC
• Secure encrypted transactions
• Automatic payment components management
• Comprehensive logging for easy debugging
• Real-time transaction status updates
• Easy integration with JavaScript and React
• CDN integration for quick setup

Fee Structure

ZinariPay charges a straightforward and affordable fee structure:

Transaction Fee	Minimum Fee	Maximum Fee
1% per transaction	$1	$5

Example:

• Small transactions: If a customer pays $50, the 1% fee would be $0.50. However, due to the $1 minimum, the fee charged is $1.
• Large transactions: If a customer pays $1,000, the 1% fee would be $10. However, due to the $5 maximum, the fee charged is $5.

For detailed pricing information, visit our Pricing Page.

Installation

Using npm

npm install zinari-pay

Using yarn

yarn add zinari-pay

Usage

Vanilla JavaScript Example

import ZinariPay from 'zinari-pay';

const zinariPay = new ZinariPay({
  appId: 'your-app-id',
  apiKey: 'your-api-key',
  publicKey: 'your-public-key',
  log: process.env.NODE_ENV === 'development',
});

document.getElementById("your-payment-button").addEventListener("click", () => {
  zinariPay.initiateTransaction({
    amount: 1000,
    notificationEmailAddress: '[e-mail]',
    details: {userId: '123'},
    onSuccess: (transactionDetails) => { /* success action */
    },
    onFailure: (transactionDetails) => { /* failure action */
    },
    onIncomplete: (transactionDetails) => { /* incomplete action */
    },
    onExcess: (transactionDetails) => { /* excess action */
    },
  });
});

React Example

import ZinariPay from 'zinari-pay';

const zinariPay = new ZinariPay({
  appId: 'your-app-id',
  apiKey: 'your-api-key',
  publicKey: 'your-public-key',
  log: process.env.NODE_ENV === 'development',
});

const App = () => {
  const handlePayment = () => {
    zinariPay.initiateTransaction({
      amount: 500,
      notificationEmailAddress: '[e-mail]',
      details: {orderId: '567'},
      onSuccess: (transactionDetails) => { /* success action */
      },
      onFailure: (transactionDetails) => { /* failure action */
      },
      onIncomplete: (transactionDetails) => { /* incomplete action */
      },
      onExcess: (transactionDetails) => { /* excess action */
      },
    });
  };

  return <button onClick={handlePayment}>Pay with Crypto</button>;
};

Zinari Pay CDN Integration

<script src="https://cdn.jsdelivr.net/npm/zinari-pay/dist/zinari-pay-cdn-bundle.umd.js"></script>
<script>
    window.zinariPay = new ZinariPay({
        appId: 'your-app-id',
        apiKey: 'your-api-key',
        publicKey: 'your-public-key',
    });
</script>

Notes

• Replace placeholder values (your-app-id, your-api-key, your-public-key) with actual credentials.
• Always ensure script tags use the latest CDN bundle.

Known Issues

CORS Error

Resolve by adding your environment URLs to whitelisted URLs in your ZinariPay console.

Happy Coding

• CzA