CryptoJobsList Blog

How to add Ethereum payments to your site with MetaMask

2 min read

About a year ago I've uploaded a quick Ethereum and Metamask coding guide on YouTube:

Today, due to popular demand, I’d like to write a quick article on adding Ethereum payments to your website. This guide assumes that you are new to programming, and I’ll try to avoid referencing complex web dev frameworks like React… Knowing basic jQuery will suffice here.

Let’s get your set-up ready, step by step:

  1. Make sure you have Metamask installed.

  2. For development, switch to Ropsten or Kovan development network.

  3. Get some Ether in your account on a test network via https://faucet.metamask.io/

  4. Copy paste this code

  1. Serve your html file through a server. E.g. with https://www.npmjs.com/package/serve. If you’ll open your html file directly in the browser, Metamask won’t be injected (for security reasons).

This is what you get:

metamask.gif

At the core of this function is web3.eth.sendTransaction(). You can read more about it in Web3 Docs. I’d generally recommend reading the docs in and out, but i also understand that what 99% of people want is just a simple guide to making payments.

Please write down your questions in comments below — I’ll be answering them and improving this article too.

Happy coding!

Raman Sha
Article by

Founder @ CryptoJobsList. Bought my first Bitcoin in 2014 and been working in crypto full time since 2017. I talk to companies and talent about hiring and the industry overall. Recovering software engineering geek. Avid cyclist and dead-lifter.

Related Jobs

Read Next