撇号cms - 自定义页面设置

时间:2017-02-27 14:37:00

标签: javascript apostrophe-cms

我想将元键和元描述字段添加到页面设置对话框,然后将它们渲染到页面。 我能够发现在页面模板(html)文件中可以做这样的事情:

{% extends data.outerLayout %}
{% block extraHead %}
    <meta name="description" content="this is the page description" />
{% endblock %}

但是如何让最终用户插入这些值?

2 个答案:

答案 0 :(得分:3)

好的,所以在查看apostrophe-sandbox演示网站后,我能够找到答案。 我在项目的lib/modules文件夹下添加了一个名为apostrophe-custom-pages的新文件夹,在其中添加了一个index.js文件,如下所示:

module.exports = {
  beforeConstruct: function(self, options) {
    options.addFields = [
      {
        name: 'metaDescription',
        label: 'Meta Description',
        type: 'string'
      },
      {
        name: 'metaTags',
        label: 'Meta Tags',
        type: 'string'
      }
    ]
  }
};

然后,在我的页面html模板中,我添加了:

{% block extraHead %}
  <meta name="description" content="{{ data.page.metaDescription}}" />
  <meta name="tags" content="{{ data.page.metaTags}}" />
{% endblock %}

就是这样。有用。现在我可以提供SEO支持。欢呼! :)

答案 1 :(得分:0)

这是一种改进的方法:

{% block extraHead %}
 <meta name="description" content="{{ data.page.metaDescription | truncate(146, true, "..") | safe }}" />
{% endblock %}

我们在这里做了什么:

  • 我们将元描述截断为特定长度(在本例中为146个字符,但您可以更改它);
  • 我们添加了一个很好的...最后一个用于谷歌搜索;
  • 我们将所有内容输出为&#34; safe&#34; - 这会将某些符号或字符显示为unicode / html字符串。虽然它在理论上可以被滥用。

请参阅屏幕截图以说明最后一点:Just a screenshot