# 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).


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.localramp.co/crypto-off-ramp/widget-sell/full-page-checkout.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.