将自定义 HTML 标签添加到 Ghost 或 Ghost 主题

Question

大家好。

挑战

我正在尝试创建一个 自定义 Ghost 主题，它支持 Google 的加速移动页面，即 Google AMP，但我遇到了一个问题带有用于图像的特定自定义标签。

Google AMP custom img tag

<amp-img src="welcome.jpg" alt="Welcome" height="400" width="800"></amp-img>

注意 amp-img HTML 标签。

可能的解决方案

我认为要为 Ghost 创建自定义 HTML 标签，我需要修改核心 "server" Ghost 文件吗？

当前进度

目前的进展在 my GitHub project, Ampsper v0.0

Answer 1

新版本的 ghost 支持这个，但我不相信存在对这个标签的支持我检查我的代码并找到这个

<figure class="post-image">
<amp-img src="http://www.hackemate.ninja/content/images/2016/08/pablo--4--min.png" width="600" height="400" layout="responsive"></amp-img>
</figure>

但是我的普通主题在这个部分有 alt 属性

Answer 2

解决方案

最后，Ghost release 0.10.0 系统内置了 AMP（Google 加速移动页面）支持。

摘自Ghost's AMP Documentation：

The {{image}} helper needs to be wrapped in an <amp-img> tag and must provide a width and height property and works only for post images. {{author.image}} is not supported, in amp context, but the {{image}} helper can still be used within the {{#author}}{{/author}} block expression.

示例如下：

post 张图片：

{{#post}}
    <amp-img src={{image absolute="true"}} width="600" height="400" layout="responsive"></amp-img>
{{/post}}

对于作者图片：

{{#post}}
  {{#author}}
    <amp-img src={{image absolute="true"}} width="50" height="50"></amp-img>
  {{/author"}}
{{/post}}