新商城装修

基本介绍：

新商城装修是指小程序商城和H5商城的装修，旨在提供更多丰富商家装修商城面貌的多样性，增加视觉冲击效果的可能性，进而提升商城用户体验。

相比原有装修，新装修采用了组件模块式设计，通过拖拽组件式自定义页面，简单易用。

目前，新商城装修支持的组件有1.“搜索”组件，2.“轮播图”组件，3.“广告图”组件，4.“图文导航组件”，5.“文本导航组件”，6.“商品专题”组件，7.“商品”组件，8.“视频”组件，9.“富文本”组件，后续更多组件正在陆陆续续更新上架中...

页面管理与自定义页面：初始时，首页没有数据，默认是空的，需要商家新建页面，设置一个为首页。接下来编辑具体页面内容，可以将想要展示在页面的内容以组件形式拖拽到该页面，并将页面发布后，可以到小程序/H5商城查看装修效果。

如何将页面设置为首页：

进入一个具体的装修页面编辑界面，在右上角点击“页面管理”，选中“设置首页”，发布。

组件介绍：

一、搜索组件：

基本介绍：搜索组件用于商城中搜索商品。

操作---在页面编辑区将搜索组件拖拽到页面来保存即可。其中文本内容是搜索框的提示性内容。

二、图片轮播组件

基本介绍：图片轮播组件，图片轮播组件编辑区添加图片，图片可以滑动展示。

轮播图特点是都有左右边距，样式一、二、三固定图片高度，样式四根据上传图片自适应高度。图片可以设置跳转链接到“商品分类”、“营销活动”、“页面”以及自定义“链接。

如何操作

步骤1：将图片轮播组件拖拽组件放置区域（最多可以添加10个组件）

步骤2：选择模板样式，“样式一”，“样式二”，“样式三”，“样式四”任选一个。

步骤3：设置轮播时间，默认为3秒.

步骤4：添加图片轮播共可以添加五张图片（必填项）支持格式：JPG/PNG/JPEG/GIF，大小2M之内。

步骤5：添加的图片中可以进行选择“商品分类”、“营销活动”、“页面”以及自定义“链接。（如果是自定义链接，注意需以https://开头）

四种不同样式效果介绍

1.样式一：图片轮播所添加图片展示时，在左右边距区域显示前后轮播图的一部分出来，固定高度，建议尺寸686*320像素

2.样式二：图片轮播所添加图片展示时，展示当前一张轮播图，不添加其他效果，固定高度，建议尺寸686*320像素

3.样式三: 图片轮播所添加图片展示时，在轮播图上添加红色背景效果，固定高度，固定高度，建议尺寸686*320像素

4.样式四: 图片轮播所添加图片展示时，会根据所添加图片高度自适应调整

三、图片广告组件

基本介绍：图片广告组件，利用一张图片形式进行商品宣传，图片中可添加链接，点击可直接进入界面。

广告图的特点是，左右宽度铺满屏幕，上下高度根据上传的图片自适应高度。图片可以设置跳转链接到“商品分类”、“营销活动”、“页面”以及自定义“链接。

步骤1：将图片广告组件拖拽组件放置区域（最多可以添加10个）

步骤2：点击添加图片广告，此组件中只能添加一个图片广告，添加图片，支持JPG/PNG/JPEG/GIF格式，大小2M之内

步骤3：选择跳转到的页面：下拉框中会显示”商品分类”、”营销活动”、”页面”以及”自定义链接”。（链接自定义中须以 https:// 开头协议）

四、图文导航组件

基本介绍：图文导航组件，图文导航组件编辑区可添加4个或5个导航位，添加导航位更方便。

图片可以设置跳转链接到“商品分类”、“营销活动”、“页面”以及自定义“链接。

步骤1：将图文导航组件拖拽组件放置区域（最多可以添加10个）

步骤2：选择排列样式一行4个或一行5个。选择一行4个出现4个导航位，选择一行5个出现5个导航位.

步骤3：选择滑动时是否固定顶部。

步骤4：每个导航位可添加一张图片（必填项），支持格式：JPG/PNG/JPEG/GIF，大小2M之内。

步骤5：每个导航位中标题输入标题名字

步骤6：添加的图片中可以进行选择“商品”、“营销活动”、“页面”、“组件”“链接”。（链接自定义中需以 https:// 开头）

五、文本导航组件

基本介绍：文本导航组件，利用文字形式展示导航位，导航内容可以设置跳转链接到“商品分类”、“营销活动”、“页面”以及自定义“链接。

步骤1：将文本导航组件拖拽组件放置区域（最多可以添加10个）

步骤2：点击添加文本导航，此组件中可以添加五个文本导航

步骤3：输入文本导航名字，可以输入最多四个汉字或八个英文字母（必填）；

描述文本导航，可以输入最多五个汉字或十个英文字母（选填）；

选择跳转到的页面：下拉框中会显示”商品分类”、”营销活动”、”页面”以及自定义链接。（链接自定义中需以 https:// 开头协议）

六、商品专题组件

基本介绍：商家装修时，可将最多一组25个商品放到一个专题作为推荐商品展示在页面。

步骤1：将商品专题组件拖拽组件放置区域（最多可以添加20个）

步骤2：商品专题组件显示样式可以点击设置专题名称或专题图片或专题名称+图片。

步骤3：商品专题组件专题名称可添加20个中文或20个英文字母（必填）

步骤4：商品专题组件专题图片可添加一张图片（必填）

步骤5：选择跳转到的页面：下拉框可选择显示”商品分类”、”营销活动”、”页面”以及自定义链接

步骤6：选择点击商品名称显示，则商城中商品专题中商品显示商品名称，选择点击商品名称不显示，则商城中商品专题中商品不显示商品名称。

步骤7：选择点击商品价格显示，则商城中商品专题中商品显示商品价格，选择点击商品价格不显示，则商城中商品专题中商品不显示商品价格。

步骤8：购物车：在商城首页商品专题固定时不会展示购物车，点击查看更多会展示购物车。

步骤9：点击 + 添加单品商品，最多可以添加25个单品商品

七、商品组件

基本介绍：商品组件，一个组件中可以放多个商品进行阅览，用于商城页面展示推荐的商品。步骤1：将商品组件拖拽组件放置区域（最多可以添加50个）

步骤2：商品组件展示样式可以设置一行1个或一行2个或一行3个。

步骤3：可以最多添加50个单品商品

八、富文本组件

基本介绍：添加富文本组件，满足各种样式文字/表格/图片表现样式。步骤1：将富文本组件拖拽组件放置区域（最多可以添加10个）（1）标题：对富文本编辑区正文文本标题进行设置。（2）加粗：对商户在富文本编辑区正文文本内容字体进行加粗设置。（3）字号：对商户在富文本编辑区正文文本内容字体进行设置大小。（4）字体：对商户在富文本编辑区正文文本内容字体样式进行设置。（5）文字颜色：对商户在富文本编辑区正文文本文字颜色进行设置。（6）斜体：对商户在富文本编辑区正文文本文字体进行设置为斜体。（7）下划线：对商户在富文本编辑区正文文本文字底部添加下划线。（8）删除线：对商户在富文本编辑区正文文本文字添加一行直线删除。（9）背景色：对商户在富文本编辑区正文文本文字背景添加颜色。（10）表格：对商户在富文本编辑区中添加表格。（11）链接：对商户在富文本编辑区中添加自定义链接，商城中点击”链接”会跳转自己理想的页面。（12）序列：有序列表和无需列表。有序列表：对文本用 · 进行排序。无序列表：对文本用1.、2.进行排序。（13)对齐：对商户在富文本编辑区正文文本”居左”,”居中”,”居右”,”两端”进行对齐（14）引用：商户对富文本编辑区中部分正文文本选中，引用功能，会对其文字文本进行引用。（15）图片：上传图片和网络图片（暂时不支持）（16）撤销：商户在富文本编辑区中所设置进行上一步的返回（17）恢复：商户在富文本编辑区中所设置进行上一步的恢复（18）全屏：商户在富文本编辑区中所编辑的内容进行全屏显示