跳到主要内容

店面筛选

店面筛选是 theme 中推荐的商品筛选方式,它允许商家 轻松创建 filters,用于筛选合集和搜索结果页面。

Filters 可以基于以下商品和 variant 数据:

  • 库存状态
  • 价格
  • 供应商
  • Variant 选项
  • 商品 tags

Filters 使用 AND 逻辑,filter 值使用 OR 逻辑。例如,您可以返回特定颜色和特定尺码的商品,或者返回某种颜色或另一种颜色的商品。

应用 filters 后,它们会通过 URL 参数反映在合集 URL 中。

实现店面筛选​

使用以下资源了解如何在 theme 中实现店面筛选。

Filter URL 参数​

已应用的 filters 会根据 filter 类型通过 URL 参数反映在页面 URL 中,这些 URL 参数有特定结构。

备注

在应用 filters 之前,需要先在 Shoplazza 管理后台中创建。前往在线商店 > 导航。

URL 参数结构​

Filter URL 参数由以下组件组成:

组件 必填 说明
filter 是 filter URL 参数的默认命名空间。
filter_scope 是
filter 的范围,可以是以下之一:
  • p - 表示范围在商品级别。
  • v - 表示范围在 variant 级别。
attribute 是 filter 所基于的属性。如需了解可用属性,请参阅 Filter 类型。
attribute_scope 否 option 和 price 属性的属性范围。如需了解更多,请参阅 Variant 专属 filters
value 是 filter 值。如需了解值格式,请参阅 Filter 类型。

根据 filter 的 attribute,URL 参数的格式可以是以下之一:

liquid
filter.filter_scope.attribute=vale
filter.filter_scope.attribute.attribute_scope=value

例如,如果有以下 filters:

  • 基于供应商商品选项的 filter,值为 nero
  • 基于颜色 variant 选项的 filter,值为 orange

则各自的 URL 参数如下:

liquid
filter.p.vendor=nero
filter.v.option.color=orange

多个 filters​

您可以组合多个 filters,如下所示:

liquid
filter.p.vendor=nero&filter.v.option.color=orange

您也可以对同一 filter 筛选多个值,有两种方式:

  • 在单个参数中包含多个值
  • 为每个值分别设置参数
示例
filter.v.option.color=orange,deeppink <!-- AND -->
filter.v.option.color=orange&filter.v.option.color=deeppink <!-- OR -->

Filter 类型​

Filters 可以在两个级别应用:

商品专属 filters​

以下概述了商品专属 filters 及其作为 URL 参数的表现形式:

名称

说明

参数名称

接受的参数值

商品 tags

基于特定商品 tags 进行筛选

tag

单个商品 tag 或以 & 符号分隔的商品 tag 列表。

例如:hot 或 hot&flash。

供应商

基于特定供应商进行筛选。

vendor

单个供应商或以 & 符号分隔的供应商列表。
例如:vendor1 或 vendor1&vendor2。

以下是商品专属 filters 完整 URL 参数结构示例:

示例
<!-- 商品 tags -->
filter.p.tag=hot
filter.p.tag=hot&filter.p.tag=flash

<!-- 商品供应商 -->
filter.p.vendor=vendor1
filter.p.vendor=vendor1&filter.p.vendor=vendor2

Variant 专属 filters​

以下概述了 variant 专属 filters 及其作为 URL 参数的表现形式:

名称 说明 参数名称 接受的参数值
库存状态 基于 variant 库存状态进行筛选。 availability 以下任一值:
  • 0 - 缺货的 variants。
  • 1 - 有货的 variants。
  • 0&1 - 两种库存状态的 variants。
Variant 选项
基于 variant 选项(如尺码或颜色)进行筛选。

Variant 选项 filters 还需要在 URL 参数结构的 attribute_scope 组件中指定选项名称。
例如:`option.color`。
option
单个 variant 选项值或以 & 符号分隔的 variant 选项值列表。

例如:orange 或 orange&deeppink。
价格
基于 variant 价格进行筛选。

价格 filters 还需要在 URL 参数结构的 attribute_scope 组件中指定价格条件,接受以下值:
  • gte - 大于或等于输入值的价格。
  • lte - 小于或等于输入值的价格。
price
店铺默认货币格式的单个货币金额。

例如:12 或 98.98。

以下是 variant 专属 filters 完整 URL 参数结构示例:

示例
<!-- Variant 库存状态 -->
filter.v.availability=0
filter.v.availability=0&filter.v.availability=1

<!-- Variant 选项 -->
filter.v.option.color=orange

<!-- Variant 价格 -->
filter.v.price.lte=228