Every template language works
The button is plain HTML with dashed attributes, which every Eleventy language emits verbatim. Nothing to escape, nothing to configure.
Scriptorium · III
Add a buy button to your Eleventy site
Eleventy emits whatever HTML you hand it, in any template language. The button is HTML. This guide is short because there is nothing to work around.
Add the script tag, once
Add the script tag to the head of your base layout, usually a file under _includes/, in whichever template language it speaks.
<!-- _includes/layout.njk -->
<head>
<meta charset="utf-8" />
<title>{{ title }}</title>
<script src="https://sdk.coinmoebius.com/latest/sdk.global.js"
crossorigin="anonymous"
defer></script>
</head>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 any template: Nunjucks, Liquid, WebC, or Markdown content. Eleventy passes inline HTML in Markdown through by default.
<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
Your pipeline stays yours
The script loads from our CDN at view time. Your build, your bundler, and your passthrough copies never know it exists.
Ready when your page is
Free covers 150 transactions a month. No card to sign up.