search​

search 模板渲染了搜索页面，该页面显示了商店搜索的结果。

位置​

search 模板位于主题的 templates 目录中：

└── theme
    ├── layout
    ├── templates
    |   ...
    |   ├── search.json
    |   ...
    ...

内容​

你应该在 search 模板或模板内的某个 section 中包含以下内容：

• search 对象
• search 表单
• 搜索结果

search 对象​

你可以访问 Handlebars search 对象来显示搜索的详细信息。

search 表单​

要登陆搜索页面，客户需要通过搜索表单进行搜索。你可以在主题中包含一个带有 <form> 元素的搜索表单，该元素具有 action="{{ routes.search_url }}" 属性。在表单内，你需要具有以下属性的输入：

• type="search"
• name="keyword"

你还应该设置输入字段的值，以反映 search 对象的 terms 属性的值，以便保留客户的搜索关键字：

<form action="{{ routes.search_url }}">
  <input type="search"
   placeholder="Enter search keyword"
   name="keyword"
   value="{{ search.terms }}"
  >
  <input type="submit" value="search-btn">
</form>

搜索结果​

你可以通过遍历 search 对象的 results 属性的值来展示搜索结果：

{{#for search.results as |search_item|}}
  {{! search_item details }}
{{/for}}

用法​

在使用 search 模板时，你应该熟悉如何突出显示搜索词。

突出显示搜索词​

如果你在搜索结果中输出任何相关的内容，那么你可以使用 Handlebars highlight helper 在该内容中突出显示搜索词：

{{#for search.results as |search_item|}}
  {{{ highlight search_item.title search.terms }}}
{{/for}}