Scriptorium · XII

Add a buy button to a plain HTML site

There is no framework here and nothing to install. The buy button is HTML, so a plain HTML page is the simplest place it can live. You add one line to the head and one block where you sell.

Add the script tag, once

Put the script tag inside the head of your page. If your site is more than one page, add it to the head of each page that sells, or to the shared header file if you use one.

<script src="https://sdk.coinmoebius.com/latest/sdk.global.js"
  crossorigin="anonymous"
  defer></script>

Name the product in your dashboard

Open your project, switch to the Products tab, and add the product: a reference you choose, a name, a price, a currency. From here the dashboard writes both blocks on this page with your real project ID. What you see below is the shape.

Place the button where you sell

Paste the button into the body wherever you want it to appear. The browser renders it in place, and the payment picker loads the first time a buyer clicks.

<coin-moebius-buy
  project-id="proj_YOUR_ID_HERE"
  product-id="t-shirt-medium"
  label="Buy a t-shirt">
</coin-moebius-buy>

Publish. The button renders with the page, and the payment picker loads the first time a buyer clicks it. Each additional product is the same block with a different reference and label.

Watch out for these

No build step, no problem

You do not need npm, a bundler, or a framework. Save the file, upload it, and the button works the next time the page loads.

Reuse it across pages

Selling from several pages? Put the script tag in a shared header and copy the button block wherever you need it. Each product is the same block with a different reference and label.

Works on any host

GitHub Pages, an object-storage bucket, a cheap shared host, a folder on your own server: if it serves an HTML file, it can sell. Nothing runs on your side.

Ready when your page is

Free covers 150 transactions a month. No card to sign up.