How to make an NFT Minting button on a website with no-code

If you have created your own NTF collection, then you will certainly face the problem of creating a website where buyers can replace NTF from your collection.
Below I will give several options for how to create an NTF Minting Button for your website.

1. The easiest and most convenient option is to use a ready-made website or widget from WeBill.io

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 or use this page instead of the website.

NFT Minting Link Website
NFT Mint Link

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.

NFT Mint Button Widget WeBill
NFT Mint Button Widget WeBill

Go to the WeBill community on Discord

2. You can install the library from Buildship

How to use it?

  1. Open Webflow website editor
  2. Create a new Embedded HTML code block (at least Basic site plan required)
  3. Copy & paste this code in the created block. If you already have a deployed contract, insert your address, ABI, and website link
<script src="https://cdn.jsdelivr.net/npm/web3@latest/dist/web3.min.js"></script>
<script>
window.CONTRACT_ADDRESS = "<your contract address here>"
window.CONTRACT_ABI = "<your contract ABI here>"
window.WEBSITE_URL = "<your mint website URL here>"
</script>
<script type="module" src="https://buildship-dev.github.io/mint-NFT-template/connectWallet.js"></script>
<script type="module" src="https://buildship-dev.github.io/mint-NFT-template/contract.js"></script>
<script type="module" src="https://buildship-dev.github.io/mint-NFT-template/mint.js"></script>
  1. If you don’t have a deployed contract, contact us to deploy it
  2. Create a button with ID mint-button
  3. Done!

Minting will work via Metamask wallet, and will ask to connect the wallet first, so you don’t need to add a “Connect wallet” button.

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

I just asked 23,000 developers what they think of JavaScript. Here’s what I learned.

Firebase with Kotlin : Firebase Cloud Functions [Part 2 of 2]

JavaScript Semicolons are Bad, Actually

semicolons can’t save you

How to create project templates and extension for Visual Studio 2019

Why Vue.js anyway? Learn How to quickly make a to-do list app!!

Cloning travelocity website using advanced JavaScript

Activity component: Default value of any field on New Task/New Event/Log a call tab in salesforce…

Angular vs React vs Vue

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Serafim from Via Protocol

Serafim from Via Protocol

CEO Via.Exchange

More from Medium

How I created a NFT project in a few days from scratch

Generative NFT platforms — Carving NFTs of your most favorite Comical Characters

Huge NFT update: provenance NFTs, new marketplace and auction features

Utility in an NFT