Widget Pop-up

Crypto on-ramp on your website

The widget product allows you to on-ramp your users without them leaving your website/app by just initiating a pop-up.

1. Get your public key

Get your public key from your dashboard

2. Add the inline script

<form>
    <script src="https://cdn.localramp.co/onramp-inline.js"></script>
    <button type="button" onclick="payWithLocalRamp()"> Pay </button>
</form>
<script>
    function payWithLocalRamp() {
        window.LocalRampSell.initialize({
            public_key: "pk_live_*********************",
            reference: "your-unique-reference",
            from_amount: "10", 
            from_currency: "USDT",
            crypto_chain: "TRX",
            country_code: "NG",
            to_currency: "NGN",
            email: "richard@piedpiper.com",
            widget_color: "#DA70D6",
            onClose: function (ref) {
              // Handle when the modal is closed
            },
        });
    }
</script>

Avoid exposing your secret key on the client side (or front end) of your application. Requests to LocalRamp's API should be initiated from your server.

Field
Data Type
Description

reference

String

Required - Your unique transaction reference. Must be unique for every transaction. e.g "Abc123"

email

String

Optional e.g "customer@example.com"

from_currency

String

Optionally Required - The crypto currency your user would be sending. It becomes required only if from_amount or to_amount is provided. e.g "USDT"

crypto_chain

String

Optionally Required - The crypto_chain of from_currency. It becomes required only if from_amount or to_amount is provided. e.g "BSC"

to_currency

String

Optionally Required - The fiat currency that would be received. It becomes required only if from_amount , to_amount e.g "NGN"

country_code

String

Optionally Required - The country_code where payout would be received. It becomes required only if to_currency is present e.g "NG", "KE", "GH"

from_amount

String

Optional - crypto amount the user would be paying in from_currency unit. e.g "0.02343434". If this is present, then to_amount should be omitted

to_amount

String

Optional - fiat amount that should be paid out in to_currency unit. e.g "10000". If this is present, then from_amount should be omitted

widget_color

String

Optional - Hex color code to customize widget e.g "#DA70D6"

onClose

[Function]

Optional - Gets called whenever the user closes the modal. This could be as a result of the transaction being completed or abandoned.

You can pass either the from_amount or to_amount when initializing the widget but not both.

Before passing in either the from_amount or to_amount, you'll need to know the maximum and minimum values allowed for each field. See limit section.

To get the list of supported currencies and country codes for both from_currency and to_currency see the Get currencies section.

from_amount and to_amount 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.

3. Verifying the transaction status

Once the modal is closed, the onClose function is called with the transaction reference

onClose(reference)

This is the same reference used in initializing the widget which can now be used to verify the transaction. See verify section

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.

Last updated