Prompt Users to Add Token to MetaMask

Does your website need a button that will prompt users to add a certain ERC20 token to their wallet?

Well that is super simple to do. This tutorial will cover that.

Resources for this tutorial:

• Video version of this tutorial for more details
• Example of functionality on my website
• Code for example on my website

Steps to Implement Functionality:

1: Create a button

<button>Add DAI to MetaMask</button>

2: Add method to the click handler of that button

const addTokenToMM = async () => {
}
...
<button onClick={addTokenToMM}>Add DAI to MetaMask</button>

3: Add function logic for adding token to MetaMask

const addTokenToMM = async () => {
  try {
    const { ethereum } = window
    await ethereum.request({
      method: 'wallet_watchAsset',
      params: {
        type: 'ERC20',
        options: {
          address: "0x6B175474E89094C44Da98b954EedeAC495271d0F",  // ERC20 token address
          symbol: `DAI`,
          decimals: 18,
          image…