第 200 期 在 Shopify 产品系列筛选中展示 Color Swatch 色块
Shopify Dawn 以及其他 11 款 官方免费主题 从版本 12.0.0 开始新增了对产品系列展示 Color Swatch 色块作为筛选条件的支持,不论你用的是官方免费主题还是 增强版主题,都可以参照本期教程进行设置。
本期视频教程分享如何在 Shopify 产品系列中展示色块作为筛选条件,相比纯文字,颜色会更加直观。支持自定义色值的同时,也支持单独设置图片,后续会逐步介绍。
效果示例
设置方法
主要分为五个步骤,同时可以理解为,在观看并掌握本期视频教程之后,你将学会以下内容:
- 创建元对象
- 添加元对象条目
- 添加元字段,引用元对象
- 设置元字段的值
- 添加和设置筛选条件
以上五个步骤分别对应的截图如下,具体操作参考视频演示:
额外提示:
- 设置 Image 之后会覆盖颜色显示
- App 中可以自定义筛选逻辑是 与 还是 或
- 如果你的主题产品系列筛选布局为水平方向,可在主题编辑器中切换到产品系列页面,在产品网格中将布局改为垂直,即可显示在侧边栏。