Skip to main content
Widget Mode keeps users on your platform throughout the entire transaction flow via iframe or redirect.

Overview

Widget Mode allows you to embed Rampnow’s on-ramp and off-ramp services directly into your application. Users complete transactions within an overlay or iframe without ever leaving your platform.

iFrame or Redirect

Choose between iFrame (embedded) or Redirect mode

Quick Setup

Get started in minutes with URL parameters

All Payment Methods

Support for all available Rampnow payment modes

Customizable

Pre-fill amounts, currencies and wallet addresses
Want programmatic control with event handling and TypeScript support? Use the Rampnow SDK instead — it wraps Widget Mode with a developer-friendly API and a React hook.

URL Parameters

Configure the widget by passing parameters in the URL:
ParameterRequiredDefaultDescription
apiKeyRequiredYour unique API key from the Partner Dashboard
orderTypeOptionalbuyTransaction type: buy or sell
srcChainRequiredbuy: fiat
sell: ethereum
Source chain for the asset user is spending
srcCurrencyOptionalbuy: EUR
sell: ETH
Currency user is spending (fiat for buy, crypto for sell)
srcAmountOptional100Amount in source currency
dstCurrencyOptionalbuy: ETH
sell: EUR
Currency user receives (crypto for buy, fiat for sell)
dstChainRequiredbuy: ethereum
sell: fiat
Destination chain for received currency
paymentModeOptionalLowest feePayment method: card, google_pay, apple_pay, open_banking, sepa, etc.
walletAddressOptionalUser’s crypto wallet address
walletAddressTagOptionalWallet tag/memo for supported chains (XRP, XLM, etc.)
externalOrderIdOptionalYour internal order ID for tracking

iFrame Mode

Embed the widget directly on your page for a seamless experience.
1

Create Container

Add a container element in your HTML:
<div id="ramp-container"></div>
2

Construct Widget URL

Build your URL with the required parameters:
https://app.rampnow.io/order/quote?apiKey=YOUR_API_KEY&srcCurrency=EUR&srcAmount=250&dstCurrency=BTC&dstChain=bitcoin&walletAddress=0xYourWalletAddress
3

Initialize iFrame

Embed the widget using an iframe:
<iframe 
  src="https://app.rampnow.io/order/quote?apiKey=YOUR_API_KEY&srcCurrency=EUR&srcAmount=250&dstCurrency=BTC&dstChain=bitcoin&walletAddress=0xYourWalletAddress" 
  title="Rampnow Widget"
  width="100%"
  height="600px"
  frameborder="0"
  allow="payment">
</iframe>
The widget will be embedded inside your container, providing an in-page experience for users.

Redirect Mode

Redirect users to Rampnow’s hosted page for a simpler integration.
1

Construct Widget URL

Build your URL with the required parameters:
https://app.rampnow.io/order/quote?apiKey=YOUR_API_KEY&srcCurrency=EUR&srcAmount=250&dstCurrency=BTC&dstChain=bitcoin&walletAddress=0xYourWalletAddress
2

Redirect User

Redirect the user to the constructed URL:
window.location.href = "https://app.rampnow.io/order/quote?apiKey=YOUR_API_KEY&srcCurrency=EUR&srcAmount=250&dstCurrency=BTC&dstChain=bitcoin&walletAddress=0xYourWalletAddress";
In this example, the user buys 250 EUR worth of BTC on the Bitcoin chain, with crypto sent to 0xYourWalletAddress.

Webhook Integration

Track transaction status in real-time by configuring webhooks in your Rampnow Partner Dashboard.
Set up webhooks to receive notifications when users start or complete transactions.

When to Use Widget Mode

  • Platforms wanting a deeply integrated user experience
  • Partners looking for quick integration with minimal code
  • Applications needing all available payment modes
  • Teams wanting consistent, pre-built UI
  • Fastest integration method — no custom UI needed
  • All payment methods supported out of the box
  • Pre-fill user data for convenience
  • Automatic updates without code changes

Next Steps

Rampnow SDK

Upgrade to the SDK for event handling, TypeScript support, and a React hook

Webhooks

Set up server-side transaction notifications

Supported Assets

View supported cryptocurrencies and fiat currencies

API Reference

Explore the complete API documentation