在 Ghost 中嵌入计算器
在全新的 Ghost 5(Koenig 编辑器)上实测。一张卡片搞定,无需动 Code injection 设置。
复制嵌入代码
示例是工时计算器 —— 按帮助中心列表换成任意挂件。
<iframe src="https://timecardcentral.com/embed/hours/" width="100%" height="600" style="border:0;border-radius:12px" loading="lazy" title="Free calculator by TimeCard Central"></iframe>
把 /embed/hours/ 换成任意其他挂件并调整高度 —— 完整列表见 帮助中心 首页。唯一的要求是保留挂件内的署名链接。
第 1 步:新建文章或页面
在 Ghost Admin 打开 Posts (or Pages并点击 New post / New page,给它起个标题,比如“Hours calculator” ①,然后点击下方的正文区域 ②。
第 2 步:插入 HTML 卡片
点击空行旁的 + 按钮 ① 打开卡片菜单(可能需要滚动菜单),选择 HTML ②。快捷方式:输入 /html 并回车。
第 3 步:粘贴嵌入代码
把代码粘进 HTML 卡片 ①。Ghost 会在编辑器里直接渲染 iframe 的实时预览 —— 编辑器里能看到计算器,站点上就能正常显示。
第 4 步:发布并查看
点击黑色 Publish 在右上角点击确认,然后打开文章的公开地址。完成 —— 挂件已在页面上线 ①。
常见问题
可以把挂件放到每个页面(页眉/页脚)吗?
可以 —— Ghost Admin → Settings → Code injection → Site footer 接受原始 HTML。把 iframe 粘贴进去,主题的每个页面都会显示。
编辑器里卡片显示一个灰色空框。
这是编辑器实时预览受网络延迟影响的正常表现 —— 看发布后的页面即可。如果公开页面也是空白,确认粘贴的代码以 <iframe 开头,且用的是 HTML 卡片而不是 Markdown 卡片。
对会员专属内容有效吗?
凡是能看到文章的访客都能看到挂件 —— 它完全不理解 Ghost 的会员体系。想让覆盖面最大,就放在公开文章里。