How-to

Step 1

  • Log in to your Cryptopay account
  • Navigate to Settings → Widget
  • Generate a widget key

Step 2

Add the following meta tags to your web page.
1
<head>
2
...
3
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
4
...
5
</head>
Copied!

Step 3

Add the following code to your web page.
HTML
JavaScript
1
<script src="https://widget-business-sandbox.cryptopay.me/widget.js" />
Copied!
1
const el = document.createElement('SCRIPT');
2
el.src = 'https://widget-business-sandbox.cryptopay.me/widget.js';
3
document.body.appendChild(el);
Copied!

Step 4

Widget initialization.
1
var widget = new CryptopayWidget({
2
widgetKey: 'bd3476f9-57Bc-4517-b499-afb83e1538ес',
3
accounts: ['BTC', 'ETH', 'LTC', 'XRP', 'BCH'],
4
embedded: true,
5
elId: 'cryptopay-widget',
6
styleOptions: {
7
closeButtons: false
8
}
9
});
Copied!
Parameter
Usage
Description
widgetKey
Required
Your widget key - see Step 1
accounts
Optional
Choose which cryptocurrencies you want your customers to pay with. Can be BTC, ETH, LTC, XRP and BCH. Skip this parameter to make all supported cryptocurrencies available by default
embedded
Optional
If false, the widget will popup on the page
If true, the widget will be embedded
elId
Optional
cryptopay-widget by default. The place on your web page where the widget will be plugged in
styleOptions
Optional
closeButtons - Optional. Use false to hide the blue Close buttons. See the screenshots below.
backToSelect - Optional. Use false to hide the Back button that returns the users to the initial "Choose a coin to pay with" screen
theme - Optional. Controls the color design of the widget. light (by default) or dark.
isShowQr - Optional. Use true to show the QR code on the page

Step 5

Widget calling.
1
widget.pay({
2
amount: 10,
3
currency: 'EUR',
4
customId: '2a713ee9-d401-4d97-9909-b67d6755c1c7',
5
onOpen: function () {},
6
onClose: function () {}
7
});
Copied!
Parameter
Type
Usage
Description
amount
number (double)
Required
Purchase amount
currency
string
Required
Purchase currency
customId
string
Required
Purchase reference ID in your system
name
string
Optional
Purchase name
description
string
Optional
Purchase description
metadata
object
Optional
Key-valued data
onOpen
function
Optional
Function to be called upon widget opening
onClose
function
Optional
Function to be called upon widget closing
Last modified 13d ago