Skip to main content
This example shows you how to integrate the Busha On-Ramp widget to let users buy cryptocurrency directly in your application.

​
Use Cases

  • E-commerce site accepting crypto payments
  • Wallet app letting users buy crypto
  • DeFi platform onboarding new users
  • Gaming platform selling in-game crypto assets

​
Basic Integration

​
Simple Button Integration

The quickest way to integrate the On-Ramp widget is with a button that opens the widget in a new window: 
<button
  onclick="window.open('https://sandbox.buy.busha.io/?publicKey=YOUR_PUBLIC_KEY', '_blank')"
>
  Buy Crypto with Busha
</button>

​
Iframe Integration

For a more embedded experience, use an iframe: 
<iframe
  src="https://sandbox.buy.busha.io/?publicKey=YOUR_PUBLIC_KEY"
  width="100%"
  height="700px"
  style="border: 1px solid #e5e7eb; border-radius: 8px;"
  title="Busha On-Ramp Widget"
></iframe>

​
Pre-filled Integration

​
Example: Buy Bitcoin with 50,000 NGN

<button
  onclick="window.open('https://sandbox.buy.busha.io/?publicKey=YOUR_PUBLIC_KEY&side=buy', '_blank')"
>
  Buy Crypto with Busha
</button>

​
Example: Buy to Specific Wallet Address

<button
  onclick="window.open('https://sandbox.buy.busha.io/?publicKey=YOUR_PUBLIC_KEY&cryptoAsset=BTC&address=bc1qyourbitcoinaddress&network=BTC&redirectUrl=https://your-app.com/success', '_blank')"
>
  Buy Bitcoin to My Wallet
</button>

​
Configuration Parameters

ParameterRequiredDescription
publicKeyYesYour Busha Public API Key
cryptoAssetNoCryptocurrency to buy (e.g., BTC, ETH, USDT)
networkNoBlockchain network (e.g., BTC, ERC20, POLYGON)
addressNoPre-fill destination wallet address
fiatCurrencyNoFiat currency (NGN, KES)
fiatAmountNoAmount in fiat currency
cryptoAmountNoAmount in crypto (ignored if fiatAmount is set)
redirectUrlNoURL to redirect after transaction completion

​
React Component Example

import React from "react";

function BuyBitcoinButton() {
  const openOnRamp = () => {
    const params = new URLSearchParams({
      publicKey: "YOUR_PUBLIC_KEY",
      cryptoAsset: "BTC",
      fiatCurrency: "NGN",
      fiatAmount: "50000",
      redirectUrl: "https://your-app.com/success",
    });

    window.open(`https://sandbox.buy.busha.io/?${params.toString()}`, "_blank");
  };

  return <button onClick={openOnRamp}>Buy Bitcoin with Busha</button>;
}

export default BuyBitcoinButton;

​
Dynamic URL Construction

Build the On-Ramp URL on your server for better security and flexibility: 
// Server-side (Node.js example)
app.get("/api/onramp-url", (req, res) => {
  const { amount, currency, asset } = req.query;

  const params = new URLSearchParams({
    publicKey: process.env.BUSHA_PUBLIC_KEY,
    cryptoAsset: asset,
    fiatCurrency: currency,
    fiatAmount: amount,
    redirectUrl: "https://your-app.com/success",
  });

  const onRampUrl = `https://sandbox.buy.busha.io/?${params.toString()}`;

  res.json({ url: onRampUrl });
});

// Client-side
async function openOnRamp() {
  const response = await fetch(
    "/api/onramp-url?amount=50000&currency=NGN&asset=BTC"
  );
  const { url } = await response.json();
  window.open(url, "_blank");
}

​
Complete Integration Flow

1

User Initiates Purchase

User clicks “Buy Crypto” button in your app
2

Redirect to On-Ramp Widget

Your app opens the Busha On-Ramp widget with pre-filled parameters
3

User Authentication

User logs in to Busha (or signs up), completes KYC if needed
4

User Reviews and Confirms

User reviews transaction details including rate and fees, then confirms the purchase
5

User Selects Payment Method

User chooses their preferred payment method (bank transfer, mobile money, etc.)
6

User Completes Payment

User completes the payment through their selected method
7

Busha Processes Purchase

Once payment is confirmed, Busha processes the crypto purchase and sends it to the user’s wallet

​
Learn More