Scriptorium · III

添加购买按钮到你的 Eleventy 网站

Eleventy 以你交给它的任何 HTML 发出,用任何模板语言。按钮是 HTML。这个指南很短,因为没有东西要解决。

添加脚本标签,一次

将脚本标签添加到你的基础布局的头部,通常是 _includes/ 下的文件,用它说的任何模板语言。

<!-- _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>

在你的仪表板中命名产品

打开你的项目,切换到"产品"选项卡,并添加产品:你选择的参考、名称、价格、货币。从这里仪表板用你的真实项目 ID 在这个页面上为你写两个块。你下面看到的是形状。

在你售卖的地方放按钮

将按钮粘贴到任何模板:Nunjucks、Liquid、WebC 或 Markdown 内容。Eleventy 默认在 Markdown 中传递内联 HTML。

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

发布。按钮与页面一起呈现,支付选择器在买家第一次点击时加载。每个额外产品是相同块,有不同的参考和标签。

注意这些

每个模板语言有效

按钮是带虚线属性的纯 HTML,每个 Eleventy 语言以逐字方式发出。没有转义,没有配置。

你的管道保持你的

脚本在查看时从我们的 CDN 加载。你的构建、你的打包器和你的直通复制永远不知道它存在。

当你的页面准备好时

免费涵盖每月 150 笔交易。无卡注册。