Comment on page
🎇
Quick Start
Getting Start with Rango Widget
First you need to add
@rango-dev/widget-embedded dependency.# using yarn
yarn add @rango-dev/widget-embedded
# or using npm
npm install --save @rango-dev/widget-embedded
Then you could use this code snippet to easily add widget to your project.
import { Widget, WidgetConfig } from "@rango-dev/widget-embedded";
export default function App() {
const config = {
// This API key is only for test purpose. Don't use it in production.
apiKey: 'c6381a79-2817-4602-83bf-6a641a409e32'
}
return (
<div className="App">
<Widget config={config} />
</div>
);
}
Get Your API KEY
Our service is currently free. But to use our API, SDK or Widget, you need to request an API key, describing your dApp, the blockchains you like to connect to, and your dApp domain if it's a website to enable CORS headers for your API key.
Here you could explore different examples of using widget for different frameworks:
If you want to use Rango widget directly in your html codes using IFrame, you code use code snippet below.
<div id="rango-widget-container"></div>
<script src="https://api.rango.exchange/widget/iframe.bundle.min.js"></script>
<script defer type="text/javascript">
const config = {
// This API key is only for test purpose. Don't use it in production.
apiKey: 'c6381a79-2817-4602-83bf-6a641a409e32'
}
rangoWidget.init(config)
</script>
Last modified 5mo ago