NFT Checkout

For ease of use, we have a helper which assists you in integrating the Wert Widget into your web app. You can use our SDK to initialise the payment module or, for react projects, you can use this wrapper.

You can find some examples for the integrations on Github.

💡

Did you know?

Our NFT checkout can also be used for smart contract interactions such as token purchases, just omit the extra object. Check out our example on Github.


You'll then need to import the Wert Widget:

import WertWidget from '@wert-io/widget-initializer';

And create a configuration object:

const wertWidget = new WertWidget(options);

The options you can pass to the widget are:

PropertyRequiredDescriptionData TypeDefault valuePossible values
partner_idYesProvided when you register as a partner.string
originIn sandboxInitialises the module in the sandbox/production environment.stringhttps://widget.wert.iohttps://sandbox.wert.io
skip_init_navigationNoWhen true, opens the widget in the purchase details screen.booleanfalsetrue, false
extraIf you want to show the NFT image and info in the moduleExtra object used to pass NFT’s name and image, author’s avatar, author’s name and seller’s name to the payment module using a window.postMessage method.objectSee Extra object
click_idYesUnique identifier for the order which helps you track it and us troubleshoot issues.functionuuid_v4()
signatureYesDigital signature used to encrypt the request to ensure it has been sent by you. The private key stored on your backend signs the request and the public key saved in our system decrypts it.StringSee Generate signed data
themeNoModule will use theme colors as a basis.string
currencyNoDefault fiat currency which will be selected when the module opens.stringUSDUSD
phoneNoUser's phone number in international format (E. 164 standard). The ‘+’is optional.string+11014321111
emailNoUser's email address.string[email protected]
redirect_urlNoURL where user will be redirected from KYC emails to proceed with the payment.URL string (with protocol)https://origin.us/item_id
listenersNoUse this if you want to listen to some events in the module and react to them.objectSee Listeners object structure
color_background
color_buttons
color_buttons_text
color_secondary_buttons
color_secondary_buttons_text
color_main_text
color_secondary_text
color_icons
color_links
color_success
color_warning
color_error
NoColor customisation of specific elements of Wert module.
Go to the module tuner on the partner dashboard to see how each property affects the widget.
stringHexadecimal color codes such as #FF0000
buttons_border_radius
secondary_buttons_border_radius
NoCustom radius of elements (in pixels)numeric4
langNoLanguage of the widgetstringenen - for English
fr - for French
isCryptoHiddenOptionalAllows to hide crypto mentions and exchange rate for NFT purchases if enabled for your partner Id. Contact us to set this up. booleanfalsetrue, false
isWarrantyDisabledOptionalAllows to disable NFT warranty option for specific widget mount, even if it is enabled for your partnerId and smart contract.booleanfalsetrue, false
fullnameNoUser's first and last namestringmin 3, max 69 letters; RegExp(/(\w+\s)\w+/)
date_of_birthNoUser's date of birthstringDD/MM/YYYY;
MM/DD/YYYY (USA)
country_of_residenceNoUser's country of residencestringalpha2 code of the country
state_of_residenceNoUser's state of residence (for USA)stringalpha2 code of USA state