> For the complete documentation index, see [llms.txt](https://docs.localramp.co/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.localramp.co/crypto-off-ramp/widget-sell/full-page-checkout.md).

# Full-page checkout

This allows you to redirect your users to a separate fiat off-ramp checkout page.

With the Checkout Redirect option, you can access the LocalRamp payment gateway by making a request from your server to our [initiate sell checkout endpoint](#2-initialize-the-transaction). We would return a response that includes a Checkout URL that loads the payment page where your users can sell crypto. After payment is completed or canceled, the customer is returned to any URL specified by you.

### 1. Collect payment details

Collect payment details from your user. These details are passed to the [initiate sell checkout endpoint](#2-initialize-the-transaction).

Please find below the request body for the endpoint.

<table><thead><tr><th width="190">Field</th><th width="121">Data Type</th><th>Description</th></tr></thead><tbody><tr><td>reference</td><td>String</td><td><strong>Required</strong> - Your unique transaction reference. <em>Must be unique for every transaction</em>. e.g "Abc123"</td></tr><tr><td>email</td><td>String</td><td><strong>Optional</strong> e.g "customer@example.com"</td></tr><tr><td>from_currency</td><td>String</td><td><strong>Optionally</strong> <strong>Required</strong> - The crypto currency your user would be sending. It becomes required only if <code>from_amount</code> or <code>to_amount</code> is provided. e.g "USDT"</td></tr><tr><td>crypto_chain</td><td>String</td><td><strong>Optionally</strong> <strong>Required</strong> - The crypto_chain of from_currency. It becomes required only if <code>from_amount</code> or <code>to_amount</code> is provided. e.g "BSC"</td></tr><tr><td>to_currency</td><td>String</td><td><strong>Optionally</strong> <strong>Required</strong> - The fiat currency that would be received. It becomes required only if <code>from_amount</code> , <code>to_amount</code>  e.g "NGN"</td></tr><tr><td>country_code</td><td>String</td><td><strong>Optionally</strong> <strong>Required</strong> - The country_code where payout would be received. It becomes required only if <code>to_currency</code> is present e.g "NG", "KE", "GH"</td></tr><tr><td>from_amount</td><td>String</td><td><strong>Optional</strong> - crypto amount the user would be paying in <code>from_currency</code> unit. e.g "0.02343434". If this is present, then <code>to_amount</code> should be omitted</td></tr><tr><td>to_amount</td><td>String</td><td><strong>Optional</strong> - fiat amount that should be paid out in <code>to_currency</code> unit. e.g "10000". If this is present, then <code>from_amount</code> should be omitted</td></tr><tr><td>widget_color</td><td>String</td><td><strong>Optional</strong> - Hex color code to customize widget e.g "#DA70D6"</td></tr><tr><td>callback_url</td><td>String</td><td><strong>Optional</strong> - The url to redirect your users to, when the transaction is complete</td></tr></tbody></table>

{% hint style="info" %}
You can pass either the `from_amount` or `to_amount` when initializing the widget but **not** both.
{% endhint %}

{% hint style="info" %}
Before passing in either the `from_amount` or `rto_amount`, you'll need to know the **maximum** and **minimum** values allowed for each field. See [limit section](/crypto-off-ramp/widget-sell/get-limits.md).
{% endhint %}

{% hint style="info" %}
To get the list of supported currencies, crypto chains and country codes for both `from_currency` and `to_currency` see the [Get currencies section](/crypto-off-ramp/widget-sell/get-supported-currencies.md).
{% endhint %}

{% hint style="warning" %}
**`from_amount`** and **`to_amount`** passed show payment intent and does not guarantee the exact value that would be received at the end of the transaction. To see the exact amounts received, [get transaction state](/crypto-off-ramp/widget-sell/get-transaction-state.md).
{% endhint %}

### 2 - Initialize the transaction

After collecting the necessary payment details for the transaction. Make a **POST** request to our initiate buy endpoint.

{% code overflow="wrap" %}

```
https://api.localramp.co/v1/transaction/sell-widget/initiate
```

{% endcode %}

This endpoint takes the [payment details](#1.-collect-payment-details) as the request body.

With the following header

```
x-auth-token: <SECRET_KEY>
```

This endpoint is protected by secret key authentication. So when calling it, append the `x-auth-token` header with your secret key.

If the API call is successful, LocalRamp returns the following response:

```javascript

{
    "status": "success",
    "msg": "Transaction(sell) initiated successfully",
    "data": {
        "reference": "your-unique-reference",
        "checkout_link": "https://sell-checkout.localramp.co/TYUBjkns"
    }
}

```

You should then redirect your user to the Checkout URL provided in the response to enable them to complete their payment.&#x20;

You can also choose to open the checkout link in an iframe

{% code overflow="wrap" %}

```html
<iframe src="https://sell-checkout.localramp.co/bTYUBjkns" frameborder="0" width="350" height="500" allow="clipboard-read; clipboard-write self *"></iframe>
```

{% endcode %}

Once the offramp is complete or the checkout is closed, LocalRamp will redirect your user to your specified `callback_url`.&#x20;

### 3. Verifying the transaction status

The transaction reference will be appended as a query parameter to your `callback_url` as well.

`https://website_callback_url/?reference=YOUR_REFERENCE`

You can now verify the status of the transaction. See [verify section](/crypto-off-ramp/widget-sell/get-transaction-state.md)

In a situation where no `callback_url` is passed, the user will be redirected to your business website.&#x20;

### 4. Receive confirmation via webhook

In some cases, the fiat might take a few minutes to arrive. If you do not want to keep querying the transaction status, you can always get informed when the transaction is complete through webhooks. See  [webhook section](/webhooks/introduction.md).