Payment Button
For the quickest integration of Smarty Pay payments on your website, we recommend using our open-source Client SDK. It offers a Payment Button option that can be directly placed on the merchant's website.
Using an SDK can be simpler than integrating via API; the optimal solution depends on specific integration scenarios.
React component
React component for client-side applications
Usage example
import { SmartyPayButton } from 'smartypay-client-react';
<SmartyPayButton
apiKey="YOUR_API_KEY"
amount="1.99"
token="bUSDT"
lang="en"
theme="dark"
/>
Available parameters:
| Name | Type | Required | Details |
|---|---|---|---|
apiKey | string | true | Key from API Key configuration |
token | string | true | Payment token code from Supported Tokens |
amount | string | true | The amount of the payment |
lang | en | es | fr | it | ko | false | Interface language |
theme | light | dark | false | Light or dark widget theme |
More information:
Animated button (no React)
<div id="smartypay"></div>
<script src="https://checkout.smartypay.io/sdk/smartypay-client-sdk-v1.js"></script>
<script>
new SmartyPayButton({
target: 'smartypay',
apiKey: 'YOUR_API_KEY',
amount: '1.99',
token: 'bUSDT',
lang: 'en',
theme: 'dark',
})
</script>
Available parameters:
| Name | Type | Required | Details |
|---|---|---|---|
target | string | true | Element id to insert the widget |
apiKey | string | true | Key from API Key configuration |
token | string | true | Payment token code from Supported Tokens |
amount | string | true | The amount of the payment |
lang | en | es | fr | it | ko | false | Interface language |
theme | light | dark | false | Light or dark widget theme |
More information:
Static HTML Form
Use code in your page:
<form action="https://api.smartypay.io/checkout" method="POST" target="_blank">
<input type="hidden" name="api-key" value="YOUR_API_KEY">
<input type="hidden" name="token" value="bUSDT">
<input type="hidden" name="amount" value="1.5">
<input type="hidden" name="lang" value="en">
<input type="image"
src="https://checkout.smartypay.io/checkout-button-light.svg"
name="submit"
alt="SmartyPay">
</form>
Available parameters:
| Name | Type | Required | Details |
|---|---|---|---|
api-key | string | true | Key from API Key configuration |
token | string | true | Payment token code from Supported Tokens |
amount | string | true | The amount of the payment |
lang | en | es | fr | it | ko | false | Interface language |
image | url to image | false | The image of the payment button. |