iFrame Mode Integration

The iFrame Mode allows you to embed Rampnow’s on-ramp and off-ramp services directly into your application, providing a more seamless and integrated experience for your users. This option ensures that users never leave your platform and can complete transactions within an overlay or iframe that is rendered on your website or app.

Rampnow Widget URL Parameters

Here are the parameters that you can pass in the URL:

Parameter	Required	Default Value	Description
apiKey	Required		This is your unique API key, which is available in your Rampnow Partner Dashboard. It authorizes your platform to use Rampnow services Example: `apiKey=YOUR_API_KEY`
orderType	Optional	buy
srcChain	Required	buy - fiat sell - ethereum	That chain corresponding to the asset that the user is willing to spend. In case of buy `srcChain` will be `fiat` , in case of sell, it is crypto currency Example: `srcChain=ethereum`
srcCurrency	Optional	buy - EUR sell - ETH	The currency that the user is willing to spend. For buy order type, the `srcCurrency` is fiat currencies and for sell, it is crypto currency Example: `srcCurrency=ETH`
srcAmount	Optional	100 EUR value in `srcCurrency`	This defines the amount in `srcCurrency` the user is willing to spend. You can set a default value, and users will be able to adjust it on the hosted page if needed. Example: `srcAmount=100` (This example means 100 EUR will be the order amount
dstCurrency	Optional	buy - ETH sell - EUR	The currency that the user will receive after order completion. For buy, the `dstCurrency` is in crypto and for sell, it is fiat currency. Example: `dstCurrency=ETH`
dstChain	Required	uy - ethereum sell - fiat	The chain corresponding to the currency that the user will receive after order completion. For buy, the `dstChain` is in crypto and for sell, it is fiat currency. Example: `dstChain=ethereum`
paymentMode	Optional	Payment mode with lowest fee	Allowed payment modes `[card, google_pay, apple_pay, sofort, open_banking, pix, sepa]`
walletAddress	Optional		The user's cryptocurrency wallet address where the purchased crypto will be sent. This ensures that the user doesn’t have to manually enter their wallet address on the hosted page. Example: `walletAddress=0xYourWalletAddress`
walletAddressTag	Optional		Optional wallet tag/memo for supported chains
externalOrderId	Optional		Client Order id

Implementation Steps for IFrame Mode

Set Up the Container:
Define a container element in your HTML where the widget will be embedded.
```
<div id="ramp-container"></div>
```
Create the Rampnow URL

Here’s an example of a full URL with all the parameters:
```
https://app.rampnow.io/order/quote?apiKey=YOUR_API_KEY&srcCurrency=EUR&srcAmount=250&dstCurrency=BTC&walletAddress=0xYourWalletAddress&dstCurrency=BTC
```
In this example:
- The user is buying 250 EUR worth of BTC.
- The crypto will be sent to the wallet address 0xYourWalletAddress.
- The transaction will be made in USD.
- The user's email user@example.com is pre-filled.
- The hosted page displays "YourApp" as the host and shows the logo from https://yourapp.com/logo.png.

Initialize the iFrame

Initialize iFrame by passing the constructed Rampnow widget URL as below.

<iframe src="https://app.rampnow.io/order/quote?apiKey=YOUR_API_KEY&srcCurrency=EUR&srcAmount=250&dstCurrency=BTC&walletAddress=0xYourWalletAddress&dstCurrency=BTC" title="On Ramp"</iframe>

In this case, the widget will be embedded inside the ramp-container div, providing a seamless in-page experience for your users.

Webhook Integration for Transaction Updates

You can also configure webhook notifications to receive real-time updates on transaction statuses, such as when users start or complete a transaction. Webhook setup instructions are available in the API Documentation.

Ideal For:

Platforms that want a deeply integrated and consistent user experience.
Developers with front-end resources who want more control over the user journey.