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



一、应用场景

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


二、操作步骤

(1)点击进入内容管理后台——进入产品的详情编辑页面,如下图所示:

产品管理


(2)进入后有个产品规格设置,点击添加规格项目,设置规格值及对应的缩略图,如下图所示:

添加缩略图


(3)去products系统页面添加产品列表组件,选择产品列表风格第14个风格,如下图所示:

风格14


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

展示效果

今日最后14个免费网站测评