NIUCLOUD是一款SaaS管理后台框架多应用插件+云编译。上千名开发者、服务商正在积极拥抱开发者生态。欢迎开发者们免费入驻。一起助力发展! 广告
**“可视化DIY”,同步预览前端装修效果** 榜店商城目前的首页布局也是DIY装修的,各模块自由组合拼接,满足商城个性化装修设计。 相较首页布局而言,“可视化DIY”最大的特点便是后台布局装修时能够同步预览前端效果图,因此谓之“可视化”DIY。 如下图是“可视化DIY”操作界面,左侧是基础、营销等组件,中间是商城前端效果图,右侧是具体的设置。 ![微信截图_20190719091344.png](https://www.zjhejiang.com/uploads/201907191563498851831363.png "201907191563498851831363.png") 点击左侧的组件,效果图就会出现对应的模块,在效果图中点击对应模块,就可以在右侧进行具体的设置,包括商品上传、列表样式选择等,并根据效果图进行细节调整。 **可保存N个DIY模板** 进行DIY页面设计的时候支持创建多个模板、自定义页面保存。 ![微信截图_20190719091635.png](https://www.zjhejiang.com/uploads/201907191563499009767163.png "201907191563499009767163.png") **支持商城多页面DIY** 不只是商城首页可以进行DIY! 原本首页链接页面只能选择系统固定模板,通过可视化DIY,可以将设计好的DIY模板添加到自定义页面,自定义页面会出现在“可选链接”中,通过首页模块点击链接就能进入到自定义页面。 ![微信截图_20190719092035.png](https://www.zjhejiang.com/uploads/201907191563499249240352.png "201907191563499249240352.png") ![微信截图_20190719091929.png](https://www.zjhejiang.com/uploads/201907191563499258496518.png "201907191563499258496518.png") **支持设置主题导航** 在一个自定义页面中,可以设置多个导航,链接到对应的模板。 应用场景:展示多个分类,每个分类展示不同的风格、内容。 ![微信截图_20190718111827.png](https://www.zjhejiang.com/uploads/201907181563419923159618.png "201907181563419923159618.png") **图片热区** 图片热区是榜店V4的新增功能,在一张图片上,制作任意尺寸的四边形区域,并添加链接的一种方式,可以实现在一张图片上,点击不同区域跳转不同页面的效果。 ![热区.gif](https://www.zjhejiang.com/uploads/201907181563420139800294.gif "201907181563420139800294.gif") **新增亮点功能** 除了在设计装修的操作上更简单体贴之外,可视化DIY还附加了许多亮眼功能: **商品左右滑动展示** ![1.png](https://www.zjhejiang.com/uploads/201812051543975563318423.png "201812051543975563318423.png") **秒杀倒计时** **![微信截图_20181201145849.png](https://www.zjhejiang.com/uploads/201812051543975594706145.png "201812051543975594706145.png")** **流量主** **![微信截图_20181201150712.png](https://www.zjhejiang.com/uploads/201812051543975617558422.png "201812051543975617558422.png")** **弹窗广告** **![微信截图_20181201145516.png](https://www.zjhejiang.com/uploads/201812051543975641965249.png "201812051543975641965249.png")** 除了上述功能之外,通过可视化DIY功能还可以对各个组件进行细节的自定义设计,比如按钮的样式、文字、空白间距等等。 ![](https://img.kancloud.cn/ad/6b/ad6bb582906cb1b5d2e7090a2ec35f92_1000x5563.png)