> For the complete documentation index, see [llms.txt](https://docs.bitoftrade.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.bitoftrade.com/for-businesses/allpay-widget/quick-start.md).

# Quick start

Everything you need to know to build your own widget

This tutorial shows you how to embed the crypto widget in your website easily, regardless of whether your website already functions as a decentralized application (dApp). Your users can swap ERC-20 tokens and buy/sell NFTs with the bitoftrade AllPay widget without ever leaving your website!

In this chart you can recognize the flow of the implementation of your widget:

<figure><img src="https://707480146-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FxegFG0slk40bOOCouVQE%2Fuploads%2FqhDzUF3BqKKrhUMJNR41%2Fimage.png?alt=media&amp;token=eb53fa50-e8b1-4d97-99bd-3c139a8d513e" alt=""><figcaption></figcaption></figure>

Here's a preview of your future widget:&#x20;

<figure><img src="https://707480146-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FxegFG0slk40bOOCouVQE%2Fuploads%2Fa6XkvdrwXigXed2OPVCT%2Fimage.png?alt=media&amp;token=c916c62d-0f06-4c89-ab08-72f7c6170a57" alt=""><figcaption></figcaption></figure>

By adjusting the widget's colors, font, and token list to match your app's theme, you can make it appear as though it was always there. This manual will show you how.

###
