店铺装修

店铺端 / 装修

店铺装修

店铺装修包括店铺首页DIY，以及微页面DIY；DIY中的组件支持链接微页面；

1. 功能定义

1.1 针对二开技术人员

页面DIY工具可以解决技术人员在快速搭建商户页面、灵活自定义功能、提高团队协作效率以及获取技术支持和更新等方面的问题。它们为技术人员提供了方便、高效的开发工具和平台，使他们能够更专注于业务逻辑的开发和优化，而无需从头编写和维护商户页面的基础代码。

1.2 针对用户

DIY页面为用户提供了自主创建和定制商户页面的能力，从而帮助他们解决品牌展示、营销效果、网站搭建和用户体验等方面的问题。它为用户提供了更大的自由度和灵活性，使其能够更好地满足自己的需求，并取得商业成功。

1.3 店铺装修

店铺装修：店铺装修指的是商家可以根据自己运营的商品行业，自定义自己店铺首页及微页面布局以及展示的内容、样式。

2. DIY组件说明

2.1 组件使用

通过拖拽方式支持将组件拖拽至中间内容区域

2.2 组件设置

基本上，所有组件均支持从「内容」与「样式」两个维度进行设置
其中，「内容」设置主要对组件展示内容框架、组件展示数据进行设置
而「样式」设置主要对组件颜色（包含：字体颜色、背景颜色等）、边距设置（左右间距、页面间距等）、圆角设置（背景圆角、内容圆角等）

2.3 商家组件说明

组件通过基础组件、营销组件、工具组件进行打组划分，与商城基础功能与营销功能相对应
基础组件：轮播图、头部组件、底部导航、商品列表、导航组、选项卡、视频、图片魔方、搜索框、热区
营销组件：优惠券、秒杀、拼团
工具组件：标题、辅助空白、辅助线、富文本
会员组件：会员权益、会员卡片、会员优惠券、购物金充值

3. 页面装修

操作路径：装修 >店铺装修> 店铺首页

3.1 店铺首页装修

功能说明：首页指的是商户首页的DIY定义，支持登录用户通过组件的拖拉拽快速搭建商户首页；
第一步：点击【首页装修】按钮，进入店铺首页DIY编辑页面

第二步：将组件从左边的组件区域拖拽至内容区域进行展示，最后通过右侧设置区域进行内容及样式设置。

3.2 微页面装修

功能说明：系统支持用户自主创建微页面，创建的微页面可通过导航组等相关组件进行链接跳转
第一步：点击自定义页面【添加/编辑】按钮，进入微页面DIY新增/编辑页面

第二步：操作方式同首页装修

4. 热区

功能描述：热入支持选择1张图片，支持对图片添加多个热区，并可针对每一个热区单独设置跳转页面；

操作说明：

第一步：拖拽「热区」组件至内容区域；

第二步：选择热区中需要展示的一张图片；

第三步：点击【设置热区】按钮，进行热区设置；

第四步：在图片上，按住鼠标左键进行框拉点击范围；

第五步：选择热区跳转的地址链接，点击【确定】按钮，热区设置完成。

设置完成的热区在用户端，用户点击该图片设置点击范围的框，会跳转指定链接。

5. 组件颜色

diy组件颜色可以自定义，默认读取主题色。

支持自定义组件颜色的组件

商户端diy：

轮播图：指示器颜色
头部组件：指示器颜色
商品列表：商品价格颜色
选项卡：选中颜色、价格颜色
优惠卷：优惠金额、领取按钮颜色、优惠卷背景
拼团：拼团价格、标签颜色、按钮颜色
秒杀：价格颜色
底部导航：选中颜色

示例：轮播图