Scriptorium · XI

Add a buy button to your Ghost site

Ghost handles memberships on its own. One-off products are not its job. The button fills that gap. Paste the script through Code injection. Drop the button into an HTML card. Now you can sell from any post or page.

Add the script tag, once

In Ghost admin, open Settings and then Code injection. Paste the script tag into the Site Header field. It loads on every page of the site.

<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

In the editor, add an HTML card where the button belongs. Paste the button into it. Once you publish, the page can sell.

<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

Use an HTML card

The button goes in an HTML card, not a normal text block. Ghost passes the card through as written. The button and its attributes stay intact.

It sits beside memberships

Ghost memberships keep running as they are. The button handles one-off sales next to them, with its own checkout and its own log. The two do not collide.

Self-hosted or Ghost(Pro)

Code injection works on self-hosted Ghost and on Ghost(Pro). There is no plugin to install either way.

Ready when your page is

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