How to connect WalletConnect wallet to Webflow
If you want to create your own NFT and are looking for ways to integrate Web3 to your Webflow website for wallet connect access, then below are a few ways to do it.
1. The easiest and most convenient option is to use a free ready-made website or widget from WeBill.io
Minting button for NFT
Get MetaMask and Wallet Connect NFT Minting button for Webflow for free
After filling out the form on the WeBill website, you will receive a link by clicking on which users can easily mint NFT by authorizing through any wallet such as WalletConnect, MetaMask, or Rainbow.
You only need to paste this link into the Mint button on your website.
On the plus side, after the purchase, users will see a convenient sharing function on Twitter, which makes your collection more popular.
Also, if you don’t want buyers to go to a third-party site, you can install a custom widget right on your Webflow site.
Go to the WeBill community on Discord
2. If you are good at programming, you can install the form from Buildship
GitHub - buildship-dev/metamask-button-webflow
Contribute to buildship-dev/metamask-button-webflow development by creating an account on GitHub.
How to use it?
- Create a button in Webflow
- Assign it an HTML ID
connectin button settings. Guide for Webflow
- Create a Custom Code block in Webflow
- Copy & paste this code in the custom code block:
// Change to custom button ID, starting with # (optional)
window.buttonID = "#connect"
<script src="https://cdn.jsdelivr.net/npm/web3@latest/dist/web3.min.js" />
<script type="module" src="https://buildship-dev.github.io/metamask-button-webflow/wallet.js" />
5. Done! “Connect MetaMask” button is working!
3. The hardest way is to use the library Web3Modal
GitHub - Web3Modal/web3modal: A single Web3 / Ethereum provider solution for all Wallets
A single Web3 / Ethereum provider solution for all Wallets - GitHub - Web3Modal/web3modal: A single Web3 / Ethereum…
You will have to work hard to integrate this library, but the end result is a pretty nice interface that many DeFi users will be familiar with.