# 首页布局 ### 首页布局也就是DIY页面,页面根据自己的需求可以拖拽制作。 ![](https://box.kancloud.cn/f864be4af5de42f40ccc47af4a06f370_1354x859.png) ## 功能组件简介 ### 轮播图 > 轮播图调用后台轮播图里面的数据,首页布局可以对尺寸,焦点等进行调整 > ### 广告位 > 广告位是图片模块自由组合,然后上传自己的素材设置对应链即可; ![](https://box.kancloud.cn/ff3f8a811f3c375087bd976583a45eed_1208x793.png) ### 图片列表 > 图片列表,主要是图片样式的列表,主要用于直接展示图片流的DIY。 > 图片列表的高度会根据图片高度自动识别。 > ![](https://wximg.cqkundian.com/45d6a1cc72ef2817fd65832c0e21d04a) > ### 宫格导航 > 宫格导航是调用首页分类里面数据 > ![](https://wximg.cqkundian.com/dfd7c3d417c65415cdf95741f0f7a8f6) ### 标题 > 首页里面插入标题,增加页面层次,例如活动标题、分类标题等等,对标题内容、样式、颜色、图标等都可以自定义调整 ![](https://box.kancloud.cn/73adf753390bce933025082b1a68b5f7_1219x672.png) ### 辅助空白 > 辅助空白主要是便于DIY组件之间增加间隔距离使用的。 ### 搜索框 > 此搜索框是商城里面的搜索框,便于调用在首页快速搜索想要的商品。 > ### 分割线 > 分割线主要用于组件之间或者其它需要使用线类地方使用的 > ### 图文集 > 图文集样式主要是通过以图文样式为主,然后自定义图片与文字内容 > ### 视频 > 添加视频后首页展示视频,由于微信小程序只支持mp4格式视频,所以这里的视频链接必须是.mp4格式的,否则无法播放。 > 如果没有mp4地址,是本地电脑的视频,可以上传到自己云储存上; > 如何上传视频,可以去商城里面编辑商品页面上传了复制地址过来; > ![](https://wximg.cqkundian.com/3ebeda4a399de7aaa8ff254b76c5a3f9) > 视频是不能放在最底部的否则不能播放,如果放最底部了,添加一个辅助空白; > ![](https://wximg.cqkundian.com/a9aae6951ab9f7653a74301b3dc6ac91) ### 音频 > 添加音频以后首页展示音频,音频格式要求参考微信小程序技术文档。 > ### 优惠券 > 首页直接调用营销里面的优惠券信息。 > ![](https://box.kancloud.cn/342ce01dd51272e1c5063820fe93bf37_1229x822.png) ### 天气 > 首页天气,调用天气配置里面的数据。 > ![](https://box.kancloud.cn/5a1a7002b048f56bf4d066409140fd03_1624x698.png) ### 资讯 > 首页滚动资讯,调用图文资讯,默认调用所有的数据 > ![](https://box.kancloud.cn/27eca1317d6c9ecbb4459e1f11eb2e4e_1826x643.png) ### 底部 > 底部三栏魔方图,调用底部里面数据 >![](https://box.kancloud.cn/8b9aee44b674698b507e1de39812f97c_1770x783.png) > ### 团队 > 调用团队设置里面的数据。设置在“用户”——"团队设置里面" > ![](https://box.kancloud.cn/9547843dc2a77c7953ada7fc06782baf_1588x653.png) ### 公众号 > 微信小程序设置公众号关注组件; >需要在小程序后台打开才能使用。 ![](https://box.kancloud.cn/fd01085b59e8145ce17bf275b54201fc_1563x868.png) ![](https://box.kancloud.cn/d16dadc6eea6945696b9207c4ff2d82b_1876x888.png)