电商小程序如何设计添加商品规格类型功能？

电商小程序如何设计商品规格类型功能？

商家可以为每件商品添加两种商品规格类型，为不同的商品规格分别设置规格选项值，从而方便为规格选项组合分别设置库存和价格；同时也可以提升小程序端买家选择规格选项时的体验。本文分享小程序添加商品规格类型功能设计。

一、[编辑器端] 添加商品规格类型

进入电商小程序编辑器 - 商店管理 - 商品 - 添加新商品/编辑现有商品，在商品价格及商品规格版块，点击【添加商品规格】可以添加多个商品规格选项。

如果你只有一种规格类型，可以直接点击【添加商品规格】按钮来添加规格选项，进而为不同商品规格选项设置价格、原价、库存和规格选项图片。

其中所有规格组合的图片默认显示【商品信息】版块中设置的封面图。若想要为不同的规格选项设置不同的图片，可以替换默认封面图，上传新的规格选项图片。

如果商家需要添加第二种商品规格类型，点击蓝色 “添加第二种商品规格类型”。

已经添加过的商品规格选项会以标签的形式归类到第一种商品规格类型中，商家需要为第一种商品类型设置名称。然后以同样的方式为第二种商品规格添加类型名称和规格选项标签。注意：商品规格选项标签最多可以添加10个。

注意：填写规格时请按回车保存规格标签。

设置好两种商品规格类型名称和相应的规格选项后，点击【保存】关闭弹窗，返回商

品编辑页。

此时两种规格类型的所有规格选项组合列表会全部显示出来，商家可以勾选“统一修改”选项为所有规格选项组合统一设置价格、原价和库存；也可以取消勾选“统一修改”选项，为不同的规格选项组合设置不同的价格、原价和库存。

所有规格组合的图片默认显示上面【商品信息】版块中设置的封面图，若想要为不同的规格组合设置不同的图片，可以替换规格选项图片。

如果商家想要编辑商品规格类型名称和相应的规格选项，可以点击“商品规格及商品价格”版块标题右侧的蓝色“编辑商品规格类型”，点击该链接，打开上面所述的商品规格类型编辑弹窗。

如果删除一种商品规格类型，点击【保存】后，会返回到开始只有一种商品规格类型的模式。

注意：删除一条商品规格后，系统会保留原来商品规格选项中的第一条数据。

举例：原来有两种商品规格类型：颜色、尺寸

颜色：白色，黑色

尺寸：S, M, L

商品规格组合包含：

白色 S - ￥20

白色 M - ￥10

白色 L - ￥10

黑色 S - ￥15

黑色 M - ￥10

黑色 L - ￥10

删除商品规格类型 - “尺寸”后，保存返回商品编辑。

白色 - ￥20

黑色 - ￥15

如果删除所有商品规格类型，删除后会显示最初没有添加过商品规格选项的状态。

注意：秒杀商品编辑器端中不会显示“原价”字段，秒杀价和原价不能同时存在，商家只能修改商品规格选项的秒杀价和库存。

二、[小程序端] 商品规格的显示

商家设置好商品规格后，买家进入小程序，点击商品详情页，点击【加入购物车】/

【立即购买】按钮，显示包含商品图片、规格类型和规格选项以及数量选项的弹窗。

买家选择的规格选项组合会显示在规格缩略图右下方，格式为 “已选择：{规格选项-1 规格选项-2}“。

如果商家未给某个商品规格组合选项设置商品图片，则会显示默认商品图片。