添加小部件而不显示在Netlify CMS预览中

时间:2017-12-13 18:19:51

标签: netlify netlify-cms

是否有后端窗口小部件类型允许用户在编辑器中输入文本值但未在右侧预览中显示?

我从开箱即用的示例中获得了此配置:

- label: "Blog"
  name: "blog"
  folder: "_posts/blog"
  create: true
  fields:
    - {label: "Title", name: "title", widget: "string"}
    - {label: "Publish Date", name: "date", widget: "datetime"}
    - {label: "Featured Image", name: "thumbnail", widget: "image"}
    - {label: "Body", name: "body", widget: "markdown"}

我不希望发布日期显示在预览中。

1 个答案:

答案 0 :(得分:2)

Netlify CMS允许自定义预览,并在预览中包含或排除任何您想要的内容。模仿页面布局并使用构建中的样式表来提供WYSIWYG布局。

<强> Click here for Custom Preview Template docs

CMS文件夹中的index.html

中可能包含以下内容
<script>
var PostPreview = createClass({
  render: function() {
    var entry = this.props.entry;
    var image = entry.getIn(['data', 'thumbnail']);
    var imageContainer = (image) ? h('section', {className: "mdc-card__media", style: {backgroundImage: `url(${image})`, height: '20rem'}},) : h('div');
    return h('div', {},
      h('div', { className: "blog-post" },
        imageContainer,
        h('div', { },
          h('h1', { }, 
            h('span', { }, entry.getIn(['data', 'title']))
          ),
        ),
        h('div', {className: "post-body"},
          h('div', { }, this.props.widgetFor('body'))
        )
      )
    )
    }
});

CMS.registerPreviewTemplate("blog", PostPreview);
</script>

确保在cms.js脚本链接之后包含上述脚本