# Technical Integration

## Integration Options

There are two approaches to including the widget in your website, exchange, wallet, or dApp:

### Button Opening a New Link

You can create a button that opens Onside Flow in a new tab. This is ideal if you want to keep your interface minimal or redirect users externally.

{% code title="Example:" overflow="wrap" %}

```html
<a href="https://flow.onside.io?api_key=<API_KEY>&withdraw_address=<WITHDRAW_ADDRESS>" target="_blank" class="button">Deposit Crypto</a>
```

{% endcode %}

* Replace \<API\_KEY> with your issued API key.
* Replace \<WITHDRAW\_ADDRESS> with the user’s wallet address using the special format (see Parameters).

### Embedding an iFrame

This is the fastest way to embed Onside Flow directly into your application interface.

{% code overflow="wrap" %}

```html
<iframe
  src="https://flow.onside.io?api_key=<API_KEY>&withdraw_address=<WITHDRAW_ADDRESS>"
  width="100%"
  height="100%"
  frameborder="0"
  allow="clipboard-write"
></iframe>
```

{% endcode %}

* Replace \<API\_KEY> with your issued API key.
* Replace \<WITHDRAW\_ADDRESS> with the user’s wallet address using the special format (see Parameters).

### Parameters

* `api_key`(required): your Onside Flow API key.
* `signature`(optional): your request signature. See [Request Signing](https://docs.onside.io/onside-flow/request-signing) for more details.
* `withdraw_address`(required): the user’s wallet address. Format-wise, each address should be a combination of the Token ID and the wallet address, separated by a colon.
  * Supported Token IDs:
    * `sol`: SOL wallet on Solana network.
* `user_id`(optional): your internal user ID for analytics and troubleshooting.
* `deposit_type` (optional): defines the deposit method shown to the user. Available values:
  * `crypto`: show only crypto deposit flow;
  * `fiat`: show only cash deposit flow.
  * If not specified, the user will see a selector and can choose the deposit method.

### Branding

For deeper customization (e.g., colors, fonts, logo), reach out to our team.

### Minimum Height Requirement

The Onside Flow widget requires a **minimum height of 740px** to fully display all UI components without internal scrolling.

If you wrap the widget iframe with additional padding or margins (e.g., using Tailwind classes like p-4, mt-6, etc.), make sure to **add those values to the base height**.

#### Example calculation:

Base widget height: 740px\
Wrapper padding: p-4 = 1rem (16px) on all sides → 32px vertical (top + bottom)

**Final minimum iframe height**: 740px + 32px = 786px