您想自定义您的 WooCommerce 产品搜索结果页面吗?
默认情况下,WordPress 和 WooCommerce 的搜索功能有限。通过自定义产品搜索结果,您将能够增加销售额并发展业务。
在本文中,我们将展示一些简单的方法,您可以自定义 WooCommerce 产品搜索结果页面以提供更好的用户体验。
![如何自定义 WooCommerce 产品搜索结果页面 如何自定义 WooCommerce 产品搜索结果页面](https://www.wpbeginner.com/wp-content/uploads/2022/04/customize-woocommerce-search-results-page-og.png)
为什么要自定义 WooCommerce 产品搜索结果页面?
默认情况下,WooCommerce附带内置产品搜索功能。然而,它有严重的局限性。这可能意味着您的客户将无法找到他们正在寻找的产品。
因此,您可能会失去潜在的销售额。如果您的客户找不到他们想要的东西,那么他们可能不会回到您的在线商店。
这是怎么发生的?默认的 WooCommerce 搜索仅对帖子和页面的标题、内容和摘录进行索引。执行搜索时,它不会考虑自定义字段中的任何内容。
这是一个问题,因为您的大量 WooCommerce 产品数据存储在自定义字段中。因此,您的 WooCommerce 产品类别、标签、评论和其他特殊属性都不会被编入索引。
幸运的是,您可以使用 WooCommerce 产品搜索插件解决此问题。
话虽这么说,让我们看一下一些示例,了解如何改进 WooCommerce 产品搜索结果页面。
以下是您将从本指南中学到的内容。您可以单击链接跳至您感兴趣的部分。
使 WooCommerce 产品数据可搜索
您需要做的第一件事是安装并激活SearchWP插件。有关更多详细信息,请参阅我们有关如何安装 WordPress 插件的分步指南。
SearchWP 是WordPress最好的自定义搜索插件,被超过 30,000 个网站使用。它也是WooCommerce 最好的插件之一,因为它可以为您的客户提供更相关的产品结果。
注意:您至少需要 Pro 计划才能访问 WooCommerce 集成。
激活后,您需要访问SearchWP » 设置页面并切换到“支持”选项卡以输入您的许可证密钥。您可以在 SearchWP 网站的帐户区域中找到它。
![粘贴您的 SearchWP 许可证密钥 粘贴您的 SearchWP 许可证密钥](https://www.wpbeginner.com/wp-content/uploads/2022/04/prodsearchlicense.png)
接下来,您需要安装并激活 WooCommerce 集成扩展。
您可以从 SearchWP 网站上的帐户区域下载它并像安装任何其他 WordPress 插件一样安装它。
![安装 WooCommerce 集成扩展 安装 WooCommerce 集成扩展](https://www.wpbeginner.com/wp-content/uploads/2022/04/prodsearchwoocommerceintegrationextension.png)
现在您已准备好设置 SearchWP 自定义搜索引擎。
只需转到SearchWP » 设置页面并确保您位于“引擎”选项卡上。到达那里后,您需要单击“来源和设置”按钮。
![单击“来源和设置”按钮 单击“来源和设置”按钮](https://www.wpbeginner.com/wp-content/uploads/2022/04/prodsearchsourcesandsettings.png)
这将弹出一个弹出窗口,您应确保选中“产品”旁边的复选框。这将允许 SearchWP 为您的 WooCommerce 产品建立索引。
WooCommerce产品评论存储为评论。如果您想让评论可搜索,那么您还应该选中“评论”框。
![检查产品和评论框 检查产品和评论框](https://www.wpbeginner.com/wp-content/uploads/2022/04/prodsearchcheckproductscomments.png)
完成后,单击“完成”按钮关闭弹出窗口。
现在您需要向下滚动到“产品”部分。请注意,默认情况下,该插件只会查看产品标题、内容(描述)、slug 和摘录(简短描述)。
![单击产品部分中的“添加/删除属性”按钮 单击产品部分中的“添加/删除属性”按钮](https://www.wpbeginner.com/wp-content/uploads/2022/04/prodsearchaddremoveattributes.png)
您可以通过单击“添加/删除属性”按钮来扩展 SearchWP 的范围。
这将弹出一个弹出窗口,您可以在其中在搜索中包含特定的自定义字段和分类法。在本教程中,我们添加了“颜色”和“尺寸”自定义字段,以及分类法“产品类别”和“产品标签”。
![将自定义字段和分类法添加到搜索引擎 将自定义字段和分类法添加到搜索引擎](https://www.wpbeginner.com/wp-content/uploads/2022/04/prodsearchmanageattributes.png)
您现在可以单击“完成”按钮,您应该注意到这些自定义字段和分类法已添加到 SearchWP 的产品部分。
之后,您可以调整每个属性的权重。如果您想让某个特定属性在搜索结果中更加重要,只需将滑块向右移动即可。
![调整每个属性的重要性 调整每个属性的重要性](https://www.wpbeginner.com/wp-content/uploads/2022/04/prodsearchproductssectionextended.png)
完成后,继续并单击屏幕顶部的“保存引擎”按钮以保存您的设置。
然后,SearchWP 将开始在后台重建您的搜索索引。之后,该插件将准备好开始向您的 WooCommerce 商店提供更相关的搜索结果。
![单击“保存引擎”按钮 单击“保存引擎”按钮](https://www.wpbeginner.com/wp-content/uploads/2022/04/prodsearchrulessaveengine.png)
SearchWP 将自动使用您在线商店中的任何搜索表单。但是,如果您需要添加搜索表单,请参阅我们有关如何创建自定义 WordPress 搜索表单的分步指南。这还将教您如何使用自定义 CSS设置结果页面的样式。
现在您可以前往 WooCommerce 商店尝试搜索功能。我们将搜索产品类别“连帽衫”,该类别中的所有产品都会显示。
![产品搜索结果页面预览 产品搜索结果页面预览](https://www.wpbeginner.com/wp-content/uploads/2022/04/prodsearchhoodiessearchpreview-1.png)
要了解更多信息,请参阅我们有关如何进行智能 WooCommerce 产品搜索的指南。
自定义哪些产品将显示在搜索结果页面上
默认情况下,SearchWP 将在搜索结果中包含您在线商店中的所有产品。但是,您可能希望指定应该或不应该显示哪些产品。
例如,您可以自动排除属于某些条件的产品,例如停产或缺货。或者您可能只显示正在促销或免费送货的产品。
例如,AeroPress WooCommerce 商店可让您搜索免费送货的产品。这对于顾客购买来说是一个很大的激励。
![爱乐压产品搜索结果页面 爱乐压产品搜索结果页面](https://www.wpbeginner.com/wp-content/uploads/2022/04/prodsearchexampleaeropress.png)
首先,您应该单击 SearchWP 产品部分中的“编辑规则”按钮。
![单击“编辑规则”按钮 单击“编辑规则”按钮](https://www.wpbeginner.com/wp-content/uploads/2022/04/prodsearcheditrulesbutton.png)
现在还没有规则。您可以根据需要创建任意数量的规则。
要创建第一个规则,您需要单击“添加规则”按钮。
![单击“添加规则”按钮 单击“添加规则”按钮](https://www.wpbeginner.com/wp-content/uploads/2022/04/prodsearchaddrule.png)
现在,您可以指定在搜索结果中显示或排除产品的条件。在本教程中,我们将排除所有缺货产品。
首先,您应该从第一个下拉菜单中选择“排除条目”。然后选择“产品可见性”分类法,并在旁边的字段中输入“缺货”。
![创建规则以排除缺货产品 创建规则以排除缺货产品](https://www.wpbeginner.com/wp-content/uploads/2022/04/prodsearcheditrulesforproducts.png)
如果您愿意,可以通过单击“OR”按钮添加应排除的其他条件。添加完规则后,单击“完成”按钮。
现在您需要做的就是按顶部的“保存引擎”按钮来存储您的更改。
![单击“保存引擎”按钮 单击“保存引擎”按钮](https://www.wpbeginner.com/wp-content/uploads/2022/04/prodsearchrulessaveengine.png)
要了解更多使用 SearchWP 规则的方法,请参阅我们的指南,了解如何从 WordPress 搜索中排除特定页面、作者等。
以实时模式显示产品搜索结果
实时搜索将在客户键入查询时自动显示搜索结果,从而改善 WooCommerce 商店的搜索体验。
例如,Good Dye Young 提供有关其头发和化妆品产品的实时搜索结果。
当客户输入搜索查询时,相关产品和文章会立即显示,从而提供更好的用户体验。
![Good Dye Young 产品搜索结果页面 Good Dye Young 产品搜索结果页面](https://www.wpbeginner.com/wp-content/uploads/2022/04/prodsearchexamplegooddyeyoung.png)
要将其添加到您自己的商店,您所需要做的就是安装并激活免费的SearchWP Live Ajax Lite 搜索插件。有关更多详细信息,请参阅我们有关如何安装 WordPress 插件的分步指南。
激活后,您的 WooCommerce 搜索表单将自动提供实时搜索。
![实时搜索预览 实时搜索预览](https://www.wpbeginner.com/wp-content/uploads/2022/04/prodsearchlive.png)
有关更多详细信息,请参阅我们有关如何向 WordPress 网站添加实时搜索的指南。
查找部分匹配和其他高级功能
部分匹配将帮助您的客户找到他们正在搜索的内容,即使他们没有键入整个单词或使用正确的拼写。
例如,Magna-Tiles 在线商店启用了部分匹配。客户只需输入产品名称的一部分即可在搜索结果中找到它。
![Magna-Tiles 产品搜索结果页面 Magna-Tiles 产品搜索结果页面](https://www.wpbeginner.com/wp-content/uploads/2022/04/prodsearchexamplemagnatiles.png)
要在 SearchWP 中启用部分匹配,您应该导航至SearchWP » 设置并单击高级选项卡。
在此页面上,您可以启用一些设置,使您的用户更轻松地找到他们要查找的内容。
![SearchWP 高级设置 SearchWP 高级设置](https://www.wpbeginner.com/wp-content/uploads/2022/04/prodsearchadvanced.png)
检查您想要的任何选项:
- 部分匹配还会显示与正在搜索的术语不完全匹配的结果。
- 自动“你是说吗?” 更正将建议稍微不同的搜索词,以匹配您在线商店中的更多产品。
- 支持“引用/短语搜索”将允许您的用户在搜索确切的短语时使用引号。
- 在结果中突出显示术语将使您的客户更容易在搜索结果中找到他们要查找的内容。
我们希望本教程可以帮助您了解如何自定义 WooCommerce 产品搜索结果页面。您可能还想了解如何在 WooCommerce 中添加批发定价,或查看我们的最佳电子邮件营销服务列表。