Icon 目录元件支持设置默认类别和自定义类别的入口，您可自行选择在 App 展示的具体内容。元件支持隐藏或删除功能。
⚠️ 开始前请注意：此功能在香港地区仅支持 Shopper App Pro 版本。
本篇文章将分别介绍：
一、设定 Icon 目录元件
步骤一
前往 SHOPLINE 后台 >「Shopper App 管理 > App 设计 > 目前版型」，点选「设定」进入 App 页面编辑器。
或前往「Shopper App 管理 > App 设计 > 会员中心」，点选「设定」进入会员中心页面编辑器。
步骤二
点选左侧「Icon 目录」进行编辑，或者是点击中间预览区元件内容进行编辑。如左侧元件库 Icon 目录元件被删除，可点击「添加元件」进行添加。
- 拖曳左侧元件区的
Icon 可调整元件的位置，点选
或
隐藏或删除元件。
- 点击中间预览区的
与
可调整元件位置；点选
＊注意：支持设置多个 Icon 目录。
步骤三
在右侧编辑区进行元件展示相关设置。
1. 展示标题按钮
- 默认展示标题开关为关闭
- 当打开开关，默认标题为「常用服务」，可自订义标题名称
2. 行数设置
- 您可选择展示设置的列数，例如：当您设置了 8 个入口，支持展示 4 行，则 App 会展示两列。
- 您可藉由移动滑杆控制行数。
3. Icon 尺寸设置
您可设置 Icon 展示尺寸，共「小」、「中」、「大」三种可选择。
4. 预约上架时间
此为选填项目。点击栏位右侧的「日历」Icon 可选择起迄日期。
二、设定 Icon 目录内容
步骤一
点击左侧元件库区域的「新增 Icon」进行新增。Icon 最多可以新增至 10 个。
步骤二
在右侧编辑区设置新增的 icon 内容，可根据需要选择「默认类别」或「自订义类别」。
1. 默认类别
A. 选择 icon 内容
点击「选择 icon 内容」下拉式选单，选择需新增的 icon 内容，支持 icon 包含： 领券中心、门市取货、门市推荐、门市资讯、我的地址、客服中心、客服留言、我的订单、追踪清单、浏览纪录。
＊注意：若已设置 icon ，但 App 介面未展示，代表该项权益功能未开启；如需开启，请前往后台进行设置，设置完成后，App 端 icon 目录元件将立即生效。
- 追踪清单：前往「扩充功能 > 扩充功能商店」安装功能。
- 门市资讯：如您在全通路管理平台（ONE）已维护门市信息，或在「Shopper App 管理 > App 设定 > 门市信息设定」里存在一则以上的门市信息记录，即可新增门市信息。
- 门市推荐：前往「Shopper App 管理 > App 设定 > 门市推荐设定」开启功能。
- 门市取货：如您拥有零售 POS 方案并已安装「线上买门市取」功能，即可新增门市取货。
B. 选择内容后，icon 内容設置默认选择「默认 Icon 图片」。
也可以根据品牌视觉风格选择「自定义 Icon 图片」并添加图片进行更改。
2. 自定义类别
A. 填写 icon 标题
同默认类别。
B. 勾选跳转链接
-
指定分类
勾选「指定分类」者，点击「⊕ 选择商品分类」后，在弹跳视窗里选择活动，最后点击「确认」。更多关于商品列表元件设定细节与注意事项，请参考此篇文章。
-
优惠活动
勾选「优惠活动」者，点击「⊕ 选择优惠活动」后，在弹跳视窗里选择活动，最后点击「确认」。 更多关于优惠活动元件设定细节与注意事项，请参考此篇文章。
-
自定 URL
勾选「自订 URL」者，请于栏位内输入连结。注意输入之连结必须以「https://」或「http://」开头。
Ｃ. 新增 icon 图片
点选「添加图片」进行上传。
＊注意：「我的订单」、「客服中心」 icon 支持设定自订义类别。
步骤三
完成设定后，可先点按「储存」储存元件变更；若已完成 App 首页的所有编辑，可以点击「更新并使用」发布至 App。
评论