如何点击不同的颜色选项展示对应颜色的产品主图？

一、应用场景

商户Tina运营着一家服饰在线商城，她希望系统可以让访客更直观地了解商品的SKU规格，例如将服饰颜色作为SKU选项，访客点击不同的颜色选项展示对应颜色的商品主图，这样可以更好地展现商品的特点，提高客户的商品加购率。

二、操作步骤

（1）点击进入内容管理后台——进入产品的详情编辑页面，如下图所示：

（2）进入后有个产品规格设置，点击添加规格项目，设置规格值及对应的缩略图，如下图所示：

（3）去products系统页面添加产品列表组件，选择产品列表风格第14个风格，如下图所示：

保存发布后，前台页面展示效果：实现点击产品SKU规格缩略图，显示对应产品规格图。如下图所示：