Steps

  • Get an API key by contacting us. Our contact info is mentioned here
  • Place the widget
<iframe
  src="https://exchange.payfura.com?apiKey={PARTNER_API_KEY}"
  width="50%"
  loading="lazy"
  allow="camera; accelerometer; autoplay; ; gyroscope; payment"
  frameborder="0"
  height="100%">
  Your browser does not support iframes.
</iframe>

We are also working on a partner dashboard where partners would be able to see all orders placed through their platform.

Ways to customise widget

The widget is customisable in a lot of ways.

The customisation options can be passed as query params with the widget link in src tag of iframe. For eg. below example will always open up the widget with default selected fiat currency as US dollars and cryptocurrency as Bitcoin.

<iframe
  src="https://exchange.payfura.com?apiKey={PARTNER_API_KEY}"
  width="50%"
  loading="lazy"
  allow="camera; accelerometer; autoplay; ; gyroscope; payment"
  frameborder="0"
  height="100%">
  Your browser does not support iframes.
</iframe>

More query params to customise widget

Following list contains all the possible query params that can be used to customise the widget.

apiKey
string
default: "empty"

API key unique to each partner.

Sample: apiKey=5b3b5af4-c9cd-4fc3-88b9-ec6aca28d6f2

to
string
default: "eth"

Default selected crypto currency to show when widget loads

Sample: to=btc

from
string
default: "usd"

Default selected fiat currency to show when widget loads

Sample: from=gbp

amt
number
default: "200"

Default amount of fiat currency to show when widget loads

Sample: amt=1000

walletAddress
<crypto code>:<wallet address>
default: "empty"

Comma separated values of wallet addresses in case you want to prefill wallet address when user tries to buy crypto

Sample: walletAddress=btc:0x43rwerlknwenrlekwnrewlnkr,eth:0x34kwmrkwernjnrs4k435kmk4432glfd . In this case, whenever the selected currencies in the widget are btc or eth the provided wallet address would prefill in the wallet address field in the transaction flow.

primaryColor
color hex
default: "1D0458"

Hexcode of color theme for sdk. Like button color etc.

Sample: primaryColor=4a88ce

cl
string

cl stands for crypto list. Comma separated list of crypto currencies if you only want to show a subset of available cryptocurrencies.

Sample: cl=btc,eth

Defaults to empty in which case we show all currencies

q
JWT

This param is used for masking all other params in the form of a JWT token

For more details check out here

mode
string
default: "empty"

To enforce only buy option in the widget, this key can used Only possible value possible for it at the moment is buy

Sample: mode=buy This will hide the sell tab and only show the buy tab on the main page of the widget when it loads

Defaults to empty in which case we show both buy & sell tab

disableCryptoChange
string
default: "value from `to` param"

Disables the dropdown for crypto change

disableFiatChange
string
default: "value from `from` param"

Disables the dropdown for fiat change

disableFiatAmountChange
string
default: "value from `amt` param"

Disables the textbox for changing fiat amount

disableWalletAddressChange
string

Disabled the textbox for changing wallet address

The walletAddress param mentioned above should be used in this case to set the wallet address for the user

How to sign query params in URL (Optional)

Payfura provides the ability to mask the query params if you don’t want your users to see or edit the query params.

This can be done by following the below process:

  1. Contact Payfura team to generate a JWT secret key for you.
  2. Form a JSON for your query params and sign that payload with JWT using your secret key.
  3. Pass on the generated token into the query param q while calling the widget. Eg. https://exchange.payfura.com?q=SIGNED_JWT_TOKEN

Sample code to generate the JWT token for masking query params.

const jwt = require("jsonwebtoken");

function encodeQueryParams(params) {
  try {
    const token = jwt.sign(params, JWT_SECRET_KEY), {
      expiresIn: EXPIRY_TIME
    });
    return token;
  } catch (e) {
    console.error(`Error in encoding query params ${e}`);
  }
}

// Now simply get the encoded params by calling encodeQueryParams
encodeQueryParams({"to": "btc", "mode": "buy"});