article
article
模板渲染文章页面,其中包含文章的全部内容,以及一个可选的客户评论部分。这个模板用于博客集合中的每一篇文章。
位置
article
模板位于主题的templates
目录中:
└── theme
├── layout
├── templates
| ...
| ├── article.json
| ...
...
内容
你应该在 article
模板或模板内的某个 section 中包含以下内容:
Article 对象
你可以访问 Handlebars article 对象来显示文章的详细信息。
Comment 表单
可以通过使用 Handlebars form helper 和附带的 'new_comment'
, article
参数来添加评论表单。在 form helper 内部,你需要包含以下内容:
Input | type | name |
---|---|---|
Name | text | comment[author] |
email | comment[email] | |
Comment | textarea | comment[body] |
例如:
{{#form 'new_comment' article}}
{{form.errors.messages}}
<div class="input-item__name">
<label for="name">Name</label>
<input name="comment[author]" type="text" value="{{ form.author }}">
</div>
<div class="input-item__email">
<label for="email">Email Address</label>
<input name="comment[email]" type="email" value="{{ form.email }}">
</div>
<div class="input-item__comment">
<label for="comment">Comment Content</label>
<textarea name="comment[body]">{{ form.body }}</textarea>
</div>
<div class="control__submit">
<button class="button" type="submit">Submit Comment</button>
</div>
{{/form}}
提示
当客户发布评论时,你的代码应该提供反馈,指示评论是否已成功发布,或者是否存在任何错误。
用法
在使用 article
模板时,你应该熟悉对文章评论进行分页处理的方式。
提示
如果你使用的是 JSON templates,那么任何 HTML 或 Handlebars 代码都需要包含在模板引用的section中。
对文章评论进行分页
文章评论可以通过 article 对象访问,并且每页有 50 条的限制。因此,你应该对文章评论进行分页,以确保它们都可以被访问:
{{#paginate article.comments by=50}}
{{#for article.comments as |comment|}}
<!-- comment info -->
{{/for}}
{{#if paginate.pages > 1}}
<a href='{{paginate.previous.url}}'>previous</a>
<span>{{paginate.current_page}}/{{paginate.pages}}</span>
<a href='{{paginate.next.url}}'>next</a>
{{/if}}
{{/paginate}}
这篇文章对你有帮助吗?