页面装修介绍

页面装修介绍

每一个店铺标配的4个页面都可以分别进行装修，在没有装修之前系统在每个页面默认了一些常规内容，对于这些内容你可以删除、和修改。

每个页面的装修操作完全一样，这里我们以“店铺首页”的装修为例进行讲解。

页面装修要遵循的原则：

先【添加布局】-然后在布局里【添加模块】-然后【设置】模块的内容-最后【发布】共5个环节。

1、布局介绍

名词解释

布局：是指将页面划分为不同结构的条格，页面的所有装修内容必须放置到布局内；每一个页面可以有多个布局。

目前系统提供了12个布局供选择和组合使用。

特别说明：

每一个页面的最顶部会有一个通栏布局（没有删除、移动操作）该布局里面放置的模块会自动强制显示在店铺所有页面。建议在该布局内仅放置店铺招牌、店内导航和主推活动的banner等内容；如果只想将内容显示在当前页面，请手动添加新的布局后再添加模块，请勿使用该默认布局。

2、添加布局

2.1可用的布局列表

在装修页面点击顶部左上角的【添加布局】按钮，打开如下选择器：

一共有12个布局供选择。

2.2使用说明

点击【添加】后，该布局将显示在页面的最底部，如果必要需手动向上移动。

添加后的可视化页面显示“通栏布局（990）”：

当鼠标移动到布局区域内的时候会出现布局的名字、尺寸和操作，如上图：

名词解释

通栏（990）：是该布局名称，同时指出该布局为宽度990px的通栏布局

红叉：表示删除该布局的操作，布局被删除时它所包含的内容也会一并被删除且无法恢复，操作需谨慎。绿色箭头：表示布局可用的上下移动操作

重复以上操作我们可以根据设计目的向当前网页添加多个不同版式的布局，比如在某个页面添加了7个布局，显示如下：

注意事项：

布局添加后显示为一个虚线框，每一行虚线框都是一个独立的布局。上图中选中的是左右布局，常用来左侧放置分类，右侧放置推荐商品。

你可以根据自己的设计思路，选择使用1个或者多个布局；布局的使用数量建议不要超过10个。

3、模板介绍

选择了布局就等于是为装修设定好了大纲和框架，接下来我们就要往框架里放置内容。

名词解释

功能模块：提供某些特效内容的系统功能称为功能模块。

目前系统已有5个目录分类共15个功能模块。

可用的“模块”列表

在任意一个布局的左下角有一个为名为【添加模块】的操作按钮，点击会弹出如下：

由上图可以看出模块的所属目录和名称。

上图为“店铺基础模块”，该目录下共有4个功能模块：

分页显示商品：如果您有M个商品，设置每页显示20个，那么就会有M/20个分页，直接点击页码即可查看对应页面的商品列表；每一个页面上的商品可以按照【销量】【价格】【好评数】进行排序。

默认是按照SKU的上架时间从晚到早排序的，您可以通过更换【模版】来调整默认排序。

商品类目：该模块用来显示店铺内的商品分类。

店内搜索：该模块是店铺内搜索框，您可以根据设计要求将该模块放置在合适的位置。

店内搜索结果：顾名思义用来显示搜索结果的，该模块默认在“店铺内搜索结果页面”预置了，如无特殊要求请不要删除。第二个目录显示如下：

由上图可见该目录下有2个模块：

销售排行：用来显示店铺内商品的销售榜单，默认是前10个。

商品推荐：这个模块使用的频率最高，诸如“热卖”“店长推荐”“重点推荐”等等均可以使用这个模块来实现。品牌团：仅适用于第三方卖家。商家可在该模块的“设置”里通过SKU ID录入参加了品牌团购的商品。

第三个目录为“店铺营销”模块，显示如下：

由上图可看到该目录共有4个模块：

自定义内容区：大家又称为“HTML编辑器”，也是装修店铺使用频率最高的模块之一，目前自定义内容可以上传图片、写代码等。如果您懂一些dreamweaver、html、CSS DIV的话，使用这个模块可以让您装修出更炫的效果。

导航：比较好理解，即为输入一个关键词并配置一个链接网址即可。

图片轮播：主要应用于活动和商品的推广，可在模块设置里添加大图、小图、图片标题和图片链接地址。

雷宁轮播图：通过编辑需要轮播的html片段以及背景颜色，实现html片段的轮播效果！

接下来看第四个目录“公司相关”，截图如下：

由上图可以看出该目录包含3个模块：

店铺简介：即显示品牌介绍内容的模块。

店铺公告：即显示店铺内公告信息的模块。店招模块：即显示店铺招牌内容的模块。

接下来看第五个目录“公司相关”，截图如下：

由上图可以看出该目录包含1个模块

搭配详情：展示用户在搭配购里面的商品搭配，在“设置”里输入搭配id可置入搭配信息。

在装修的时候根据设计可以添加以上15个模块中的任意一个或者多个，同一个模块在一个页面上是可以多次被使用的。

4、添加模块

4.1、添加“分页显示商品”模块

4.1.1添加的操作流程

选中要添加模块的布局，比如：

点击【添加模块】按钮，依次找到目标模块后点击【置入】，如下图：

模块置入完毕后，可对模块进行修饰和内容完善，操作如下：

4.1.2设置

点击模块的【设置】，会弹出如下操作面板：

如上图，默认选中的是【皮肤】操作。

4.1.3皮肤

名词解释

皮肤：用来美化该模块的边框和周边，详细功能如下图：

说明：

皮肤选择：系统预置了2套皮肤，可以快速选择使用

标题栏：用来设置模块标题区域范围内皮肤的操作

内容区：用来设置模块内容区域范围内皮肤的操作

底部栏：用来设置模块最底下区域范围内皮肤的操作

4.1.4模板

每一个模块系统都预置了1个或多个模版，通过更换模版可以使模块显示样子瞬间变化：