# Integration Tutorial

FaTPay integrations are flexible to enable you to integrate us into any kind of apps/websites with an optimal user journey and experience.

As mentioned in \[[#set-up-a-quick-integration](https://dev.fatpay.org/get-started/quickstarts#set-up-a-quick-integration "mention")], it is the quickest and easiest way to integrate with FaTPay, that you can just add a button or directly embed our widget in your website.

{% hint style="info" %}
FaTPay widget has responsive web design which could fit into any screens, like desktop, tablets as well as mobile devices.
{% endhint %}

Therefore, the core of integration is to construct the widget URL. And all the authentication and customization will be done by passing query parameters in that URL.

{% hint style="success" %}
For the sake of security, **Premium Partner** is mandatory to add some more parameters including the signature parameter additionally. The signature algorithm is elaborated here \[[widget-signature](https://dev.fatpay.org/reference/integration-tutorial/widget-signature "mention")].
{% endhint %}

## Widget URL

### Domain

> <https://ramp.fatpay.xyz/home>

### Common parameters

{% hint style="warning" %}
All keys and values of parameters are case-sensitive.
{% endhint %}

#### **`partnerId`**

* ***Description:*** The unique partner ID assigned by FaTPay during onboarding process, while fixed as *`public`* for Public Partners, e.g. *`partnerId=public`*;
* ***Format:*** String;
* ***Required:*** Mandatory for all partners;
* ***Signed:*** Mandatory to sign for Premium Partners;

#### **`timestamp`**

* ***Description:*** Unix timestamp in second, e.g. *`timestamp=1656600459`*;
* ***Format:*** String(10);
* ***Required:*** Mandatory for Premium Partners. While optional for others;
* ***Signed:*** Mandatory to sign for Premium Partners;

#### **`timeout [only NFT Checkout Widget need]`**

* ***Description:*** Unix timestamp in second, e.g. *`timestamp=1656600459`*;
* ***Format:*** String(10);
* ***Required:*** Mandatory for Premium Partners. While optional for others;
* ***Signed:*** Mandatory to sign for Premium Partners;

#### **`nonce`**

* ***Description:*** Random integer, e.g. *`nonce=183214`*;
* ***Format:*** String(6);
* ***Required:*** Mandatory for Premium Partners. While optional for others;
* ***Signed:*** Mandatory to sign for Premium Partners;

#### **`signature`**

* ***Description:*** Signature generated based on *`SecretKey`* and all need-to-be-signed parameters, e.g. *`signature=4UoZ2gIm3bcLTw5K6WdBJIaYBiXgQF3uvOfY4Ovc6+4=`*;
* ***Format:*** String;
* ***Required:*** Mandatory for Premium Partners. While optional for others;
* ***Signed:*** Mandatory to sign for Premium Partners;

### Append parameters to URL

Eventually, we will get the widget URL as following.

* ***Public Partner***

  > <https://ramp.fatpay.xyz/?partnerd=public>
* ***Basic Partner***

  > <https://ramp.fatpay.xyz/?partnerd=unique-partner-id>
* ***Premium Partner***

  > <https://ramp.fatpay.xyz/?partnerd=unique-partner-id\\&timestamp=1656600459\\&nonce=183214\\&signature=4UoZ2gIm3bcLTw5K6WdBJIaYBiXgQF3uvOfY4Ovc6+4=>

## Customization options

For more customization options, please check

{% content-ref url="integration-tutorial/on-ramp-widget-customization" %}
[on-ramp-widget-customization](https://dev.fatpay.org/reference/integration-tutorial/on-ramp-widget-customization)
{% endcontent-ref %}

{% content-ref url="integration-tutorial/nft-checkout-widget-customization" %}
[nft-checkout-widget-customization](https://dev.fatpay.org/reference/integration-tutorial/nft-checkout-widget-customization)
{% endcontent-ref %}

{% content-ref url="integration-tutorial/interface-customization" %}
[interface-customization](https://dev.fatpay.org/reference/integration-tutorial/interface-customization)
{% endcontent-ref %}