Configure the Widget
Our widget offers a range of variable features for you to customize according to the specific needs of your project. You can begin by configuring the fundamental settings, such as the default source and destination chains, tokens, and the input amount in the default setting.
const config = {
fromInput: '0.1',
fromToken: {
address: '0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE',
chainId: '1'
},
toToken: {
address: '0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE',
chainId: '56'
}
}
function App() {
return (
<div>
<XSwapWidget config={config} />
</div>
)
}
const config = {
...,
disabledChains: ['25', '108', '137', '10', '1285', '8127', '592']
}
XY Finance offers services across multiple chains, and our partners can choose to disable certain chains by configuring the
disabledChains setting. This results in a simpler and more streamlined interface for users, allowing them to quickly find the information they need. Here's an example with a few disabled chains to demonstrate this.
const config = {
...,
disabledTokens: [
{
address: "0x77777777772cf0455fb38ee0e75f38034dfa50de",
chainId: "1"
}
],
}
If you choose to disable a particular token from appearing on their widget, it will no longer be searchable by its symbol name or address. This provides customers with an easy way to block tokens they may dislike or not trust. To illustrate this, we'll use our $XY token as an example.
const config = {
...,
featuredTokens: [
{
address: "0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE",
chainId: "321"
},
{
address: "0x2ca48b4eea5a731c2b54e7c3944dbdb87c0cfb6f",
chainId: "321"
}
]
}
To make it easy for customers to promote a token to their partners, we offer a 'featured token' function. With this feature, you can pin the token you want to display at the top of the list, giving it greater exposure.
Last modified 4d ago