Embed the Widget

There are two ways to open the widget URL. Both run the same flow and take the same parameters.

Mode	The user	Best for
iFrame	Stays on your page	Web apps that want an in-page experience
Redirect	Goes to Rampnow’s hosted page	The simplest setup, native apps, email links

The examples below use the sandbox host. Switch to https://app.rampnow.io and your production key when you go live.

iFrame mode

Embed the widget directly on your page.

Create a container

Add a container element in your HTML:

<div id="ramp-container"></div>

Construct the widget URL

Onramp (buy)
Offramp (sell)

https://app.sandbox.rampnow.io/order/quote?apiKey=YOUR_API_KEY&orderType=buy&srcCurrency=EUR&srcChain=fiat&srcAmount=250&dstCurrency=BTC&dstChain=bitcoin&walletAddress=bc1qYourWalletAddress

https://app.sandbox.rampnow.io/order/quote?apiKey=YOUR_API_KEY&orderType=sell&srcCurrency=USDT&srcChain=ethereum&srcAmount=500&dstCurrency=EUR&dstChain=fiat

Add the iframe

Put an iframe pointing at that URL inside your container:

<iframe
  src="https://app.sandbox.rampnow.io/order/quote?apiKey=YOUR_API_KEY&orderType=buy&srcCurrency=EUR&srcChain=fiat&srcAmount=250&dstCurrency=BTC&dstChain=bitcoin&walletAddress=bc1qYourWalletAddress"
  title="Rampnow Widget"
  width="100%"
  height="600px"
  frameborder="0"
  allow="payment">
</iframe>

Keep allow="payment" on the iframe. Browser payment methods inside the widget need it.

Redirect mode

Send the user to Rampnow’s hosted page.

Construct the widget URL

Build the URL exactly as for the iframe:

https://app.sandbox.rampnow.io/order/quote?apiKey=YOUR_API_KEY&orderType=buy&srcCurrency=EUR&srcChain=fiat&srcAmount=250&dstCurrency=BTC&dstChain=bitcoin&walletAddress=bc1qYourWalletAddress

Redirect the user

window.location.href = "https://app.sandbox.rampnow.io/order/quote?apiKey=YOUR_API_KEY&orderType=buy&srcCurrency=EUR&srcChain=fiat&srcAmount=250&dstCurrency=BTC&dstChain=bitcoin&walletAddress=bc1qYourWalletAddress";

In this example, the user buys 250 EUR worth of BTC on the Bitcoin chain, with the crypto sent to bc1qYourWalletAddress.

Track the order

Track orders with webhooks, and pass externalOrderId to match each order to your own records. If you also want browser events in your page, such as ORDER_COMPLETED, use the SDK instead.

Build with AI

Learn about Rampnow

What's Supported

Integrations

Help

iFrame mode

Redirect mode

Track the order

Next steps

Webhooks

Sandbox Testing

​iFrame mode

​Redirect mode

​Track the order

​Next steps

Webhooks

Sandbox Testing

iFrame mode

Redirect mode

Track the order

Next steps