如何使用产品搜索组件？

一、什么是产品搜索组件？

产品搜索组件是一个产品搜索框模块，在此搜索框输入搜索关键词可以快速查找与该关键词相匹配的产品，可以实现对产品名称、产品关键词、产品型号、产品摘要、产品描述（第一组）的模糊匹配搜索。产品搜索组件一般会放在产品中心页面或者放在网站页头醒目的位置，这样每个页面都会出现，访客在每个页面都可以快速搜索产品。
前台展示效果举例：

二、使用产品搜索组件实现搜索功能，需要符合哪些条件？

产品搜索组件可以实现对产品名称、产品关键词、产品型号、产品摘要、产品描述（支持5组产品描述，只有第一组参与搜索）的模糊匹配搜索。要实现成功的搜索结果，需要同时符合以下两个条件：
1、系统的产品总列表页面中的产品列表组件需要显示所有的产品分类下的产品；
系统的产品总列表页面是指下图所示的“Products”页面：

产品列表组件需要显示所有的产品分类下的产品，见下图：

2、产品需要是上架状态；

三、如何使用产品搜索组件？

如果你的页面上已经有这个组件了，就不需要再添加，直接根据需要进行相关操作就可以（具体操作见下文所述）；
如果你的页面上需要这个组件，但是还没有添加，就需要先添加产品描述组件了；
怎么判断页面上有没有这个组件？单击查看如何查看某一块内容是使用什么组件制作的？

1、如何添加产品搜索组件？
在页面上添加组件的方法都是一样的，单击查看如何添加组件？，要添加的组件名称为“产品搜索”，如下图所示：

2、如何设置产品搜索组件？
需要进入产品搜索组件的“设置”功能去设置，进入组件的“设置”分两种情况：
1）此组件已经添加好的情况：进入所有这种情况下组件的设置，方法都是一样的，可以参考这个攻略：如何进入组件的设置项？
2）新添加的组件情况：在添加此组件时会弹出这个组件的设置窗口。

在弹出的设置产品搜索窗口，可以设置产品搜索组件的内容、风格。

内容
组件标题：在此可以输入这个组件的标题，输入则显示，不输入此字段也不会显示；
预留关键字：在此可以输入预留关键字，展示的位置如图所示；
推荐关键字：可以设置显示推荐的关键字，展示的位置如下图所示；

风格

选择搜索框风格：在此可以选择适合的搜索框风格，单击“展开设置”之后，可以设置如下内容：
进一步设置搜索框风格：支持设置搜索框的高度和圆角弧度；
设置搜索输入框样式：可以设置文字大小、文字颜色、背景颜色、边框宽度、边框颜色；
设置搜索按钮样式：可以设置图标大小、图标颜色、背景颜色；

选择关键词显示位置：如果在内容里显示了推荐关键字，在此可以设置关键词显示的位置，居左、居右、居上、居下、下拉框；
设置组件焦点状态样式：指的是用户的光标焦点在搜索框内时的样式，可以自定义下面的内容：
设置搜索输入框样式：文字颜色、背景颜色、边框颜色；
设置搜索按钮样式：图标颜色、背景颜色；

设置好以上内容之后，要单击“保存”按钮才可以生效哦。

3、保存、预览、发布
设置好以上内容以后要单击页面右上角的“保存”按钮，目的是把此修改保存到网站后台；
然后可以单击“预览”按钮查看不同终端下展示的效果，如果不合适可以到后台再做修改；
如果需要让访客也看到，需要单击页面右上角的“发布”按钮，发布之后稍等两分钟左右即可看网站前台展示效果。

根据需要还可以对这个组件做以下操作，具体请单击以下链接了解。

4、单击查看如何编辑组件的样式？
组件的“编辑样式”功能主要可以编辑此组件的以下内容：组件背景、组件边框、组件边距、文字字号、颜色等，根据需求选择使用；
组件的“编辑样式”功能操作入口：所有组件的“编辑样式”功能操作入口都是一样的，具体操作方法请单击查看如何编辑组件的样式？

5、单击查看如何应用组件？
通过组件的“应用组件”功能，可以将当前页面的组件应用到其他页面上，因为原理上它们是同一个组件，所以在任何被应用到的页面上编辑/删除组件时，被应用的页面会一起变化，这个是“应用组件”和“复制组件”最本质的区别。此功能经常用于面包屑导航、产品分类组件、文章分类组件等。被应用过去的组件会出现在页面的最底端，可以用鼠标左键按住组件名称拖动到需要的位置；
组件的“应用组件”功能操作入口：所有组件的“应用组件”功能操作入口都是一样的，具体操作方法请单击查看如何应用组件？

6、单击查看如何删除组件？
如果确定不需要这个组件了，可以通过“删除组件”按钮把此组件删除掉，被删除的组件会默认放到组件回收站中。
组件的“删除组件”功能操作入口：所有组件的“删除组件”功能操作入口都是一样的，具体操作方法请单击查看如何删除组件？

7、单击查看如何恢复组件？
如果需要恢复已经删除的组件，可以到组件回收站中，找到对应的组件，然后执行【还原】操作，即可恢复此组件到原有的页面上，通常会位于页面的最底端。
恢复组件的操作入口：所有组件的恢复功能操作入口都是一样的，具体请单击查看如何恢复组件？