🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
[TOC] # 使用说明 ## 模板管理 点击右上角“添加模板”按钮,设置并创建模板 ![](https://img.kancloud.cn/4b/d7/4bd7c5ce7e163bc7f684f9c2cf872fde_1622x446.png) 左侧”组件栏“中选择添加组件,中间调整组件位置,右侧编辑刚添加的组件 ![](https://img.kancloud.cn/d9/97/d9973755af0e9dc8bb955a0484201691_1617x583.png) (注:点击左侧“组件栏”中的组件,默认出现在中间“商城首页”中组件的下方) ## 自定义页面 点击上角“新增页面”按钮,设置、增加页面 ![](https://img.kancloud.cn/41/b3/41b389b4e2e3363af66a2fd4de72b61b_1622x598.png) 点击“选择模板”按钮,选择模板 ![](https://img.kancloud.cn/ab/4a/ab4ac55e45cadb57f0fe100cd307572b_1617x593.png) 打开“设为首页”开关,此自定义页面即为小程序首页 ![](https://img.kancloud.cn/51/35/513544753097cbc4fd8ff8c0d6520c74_1617x659.png) ## 授权页面 可设置用户进入小程序后,是否登录授权和热区设置。 ![](https://img.kancloud.cn/f3/58/f358716da732d9a0c5f9c17738759722_1623x702.png) ***** # 搜索 点击左侧组件栏“搜索”组件添加到商城页面 ![](https://img.kancloud.cn/5c/fe/5cfead4ba53615db7c522031c8f0ed94_1618x696.png) 点击中间商城页面“搜索”组件,可在右侧编辑栏中,编辑组件信息 ![](https://img.kancloud.cn/f1/72/f172423bce5660062098bbb31e895174_1616x753.png) ***** # 导航图标 添加导航图标后,在右侧编辑栏中,编辑导航图标基础信息 ![](https://img.kancloud.cn/b9/ab/b9ab77f7dd182ac9edda4ddaa9c38154_1619x729.png) 根据实际使用图标数量,点击“添加图标”按钮添加导航图标 ![](https://img.kancloud.cn/1b/9a/1b9a534bf6ab2ca5b7d83813d7d455b4_1610x643.png) ![](https://img.kancloud.cn/b3/96/b3962848435f8dbbc9d9e30d3d489781_1622x624.png) 上传图片,设置名称,设置图标链接 ![](https://img.kancloud.cn/54/8e/548e4f53848db3e67bea36e9a44447c9_1611x703.png) 点击“选择链接”按钮,在弹出框中,选择相应的链接,为图标设置链接 ![](https://img.kancloud.cn/8c/52/8c5209033fca52c6af1ec8cb665d9d9c_1621x726.png) 移动端样图 ![](https://img.kancloud.cn/07/9f/079fc9cdc48421d205a2232e28d550fe_1611x809.png) ***** # 轮播广告 点击左侧“轮播广告”组件,添加后,右侧编辑轮播广告 ![](https://img.kancloud.cn/ed/ef/edef3045f41a3a553aba0390e2d24cc7_1614x728.png) 选择并上传轮播图片,选择链接,点击保存(可设置多个轮播广告图) ![](https://img.kancloud.cn/70/d4/70d437629ce753dad33174cadf06788f_1614x390.png) ***** # 公告 添加公告后,在右侧编辑栏中,编辑公告基础信息 ![](https://img.kancloud.cn/9d/f2/9df269d54cec23daaed7ca36cffa07d2_1621x622.png) ![](https://img.kancloud.cn/c8/ff/c8ff48b39ef4440c3a5db64a3ed89392_1618x627.png) ***** # 专题 添加专题后,在右侧编辑栏中,编辑专题基础信息。 ![](https://img.kancloud.cn/21/ce/21ce75e3038ac7a5ddfbec5223fbcc79_1618x703.png) ***** # 关联链接 添加关联链接后,在右侧编辑栏中,编辑关联链接基础信息 ![](https://img.kancloud.cn/77/31/77318657f905f019079a410b68525aa7_1613x772.png) ***** # 图片广告 添加图片广告后,在右侧编辑栏中,选择图片广告样式 ![](https://img.kancloud.cn/e6/f9/e6f98766a4f49f09f9be68e92c57db3e_1613x644.png) 根据系统要求尺寸上传图片,选择链接 ![](https://img.kancloud.cn/04/39/04397935707e19cea4afeb052d13d315_1617x401.png) **热区设置** 点击“热区划分”按钮,进行热区设置 ![](https://img.kancloud.cn/74/38/74384055a679401e4a172cdf194e6a8a_1616x551.png) 在弹框中,图片广告的范围内,用鼠标画出热区范围(可划多个范围) ![](https://img.kancloud.cn/87/f4/87f4e887b57bc9b99c584be03dcd5107_1612x496.png) (每个热区都可设置链接,用户点击到热区范围,就会跳转到对应的链接) ***** # 视频 添加视频后,在右侧编辑栏中,设置视频封面,并选择、上传视频。 ![](https://img.kancloud.cn/fb/1b/fb1b03bc9a6fbc61bd9ee26aef7ca59b_1614x749.png) ***** # 商品 添加商品组件后,在右侧编辑栏中,设置展示样式,选择展示商品 ![](https://img.kancloud.cn/ab/e2/abe2c8d8a311220c0e61a3ce4c7d3d8a_1606x779.png) ![](https://img.kancloud.cn/94/b2/94b214c47bb862fbb6ad7ffd56665b89_1591x783.png) ***** # 门店 添加门店组件后,在右侧编辑栏中,设置展示样式,并选择门店。 ![](https://img.kancloud.cn/27/7b/277b0e48afc20891f8112d188d62e5fb_1614x730.png) ![](https://img.kancloud.cn/3f/55/3f55ede962b0c44481ecdb4bf02e26dc_1609x646.png) ***** # 版权 添加版权组件后,在右侧编辑栏中,编辑展示样式以及版权内容 ![](https://img.kancloud.cn/54/36/543623d301ff267da533a7ca56cefc9f_1615x780.png) ***** # 签到 添加签到组件后,在右侧编辑栏中,编辑展示样式。 ![](https://img.kancloud.cn/75/31/7531c46422e7df111c312b1133946845_1614x748.png) **热区设置** 点击“热区划分”按钮,进行热区设置 ![](https://img.kancloud.cn/22/2f/222f13ae2d96535528ca9480dd79e903_1622x553.png) 在弹框中,图片广告的范围内,用鼠标画出热区范围(可划多个范围) ![](https://img.kancloud.cn/5c/61/5c610ef29ceee2af739713bf78e02654_1620x494.png) (每个热区都可设置链接,用户点击到热区范围,就会跳转到对应的链接) ***** # 用户信息 添加用户信息组件后,在右侧编辑栏中,编辑此组件展示样式 ![](https://img.kancloud.cn/ca/b7/cab7c76ba7de3d13f3de96c5f4a64331_1608x766.png) ***** # 订单入口 添加订单入口组件后,在右侧编辑栏中,编辑展示样式 ![](https://img.kancloud.cn/02/9f/029f8c8daaf33ace560bc82a2331ab7a_1609x749.png) ***** # 地图 添加地图组件后,在右侧编辑栏中,编辑展示样式,地图选点 ![](https://img.kancloud.cn/5b/7e/5b7e3f224f8b3499811ada9d006a9497_1617x715.png) ![](https://img.kancloud.cn/76/35/76357c66d148d4fc123781e1cb6cf2ca_1619x717.png) ***** # 微信公众号 添加微信公众号组件后,在右侧编辑栏中,编辑展示位置(此小程序关联的公众号链接入口) ![](https://img.kancloud.cn/4c/e1/4ce133f72655f09bb2a5075daa9dffeb_1617x760.png) ***** # 自定义表单 添加自定义表单组件后,在右侧编辑栏中,编辑表单内容,样式, ![](https://img.kancloud.cn/92/7b/927baddd2e2bf870474467d2d9a177ad_1616x736.png) ![](https://img.kancloud.cn/ab/90/ab90c9acc3778f2ff2d1871bc891cdd1_1618x737.png) ***** # 优惠券 添加优惠券组件后,在右侧编辑栏中,编辑展示样式。 ![](https://img.kancloud.cn/57/46/574651fe3de365e4b1ea625ac9a4cb43_1614x741.png) ***** # 倒计时 添加倒计时组件后,在右侧编辑栏中,编辑倒计时活动和展示样式 ![](https://img.kancloud.cn/ad/9b/ad9b936a43d425c62203de5c62cebc08_1619x769.png) ***** # 好店推荐 添加好店推荐组件后,在右侧编辑栏中,编辑展示样式,添加选择店铺。 ![](https://img.kancloud.cn/de/bd/debd608db82617263bc5474f232d98e2_1627x747.png) ***** # 拼团 添加拼团组件后,在右侧编辑栏中,编辑展示样式,选择拼团商品。 ![](https://img.kancloud.cn/ad/c9/adc9aa2a87744a8dc31727946b044594_1619x752.png) ![](https://img.kancloud.cn/de/40/de40e079b005f5b6f0903025afd6f93a_1618x752.png) ***** # 预约 添加预约组件后,在右侧编辑栏中,编辑展示样式,选择预约商品。 ![](https://img.kancloud.cn/af/39/af3960bda033a08853f161a1605dffda_1607x751.png) ![](https://img.kancloud.cn/03/b5/03b5c1441f854ca1bbc61177d09ffae7_1618x754.png) ***** # 秒杀 添加秒杀组件后,在右侧编辑栏中,编辑展示样式,选择秒杀商品。 ![](https://img.kancloud.cn/11/05/1105de1bd40ae5372534c18cc40ea584_1612x750.png) ![](https://img.kancloud.cn/74/51/745155c18c604a78fc88349c364f90e8_1617x752.png) 秒杀场次:创建秒杀商品时,选择的日期和时间。 ![](https://img.kancloud.cn/1f/17/1f17b6735d5f04ad3438dcff7154da28_1607x704.png) ***** # 砍价 添加砍价组件后,在右侧编辑栏中,编辑展示样式,选择砍价商品。 ![](https://img.kancloud.cn/92/db/92db399564bb4801cd56a49b4057b61c_1624x778.png) ![](https://img.kancloud.cn/fd/33/fd332370124e5bb53a3934195be8a3eb_1616x769.png) ***** # 积分商城 添加积分商城组件后,在右侧编辑栏中,编辑展示样式,选择积分商城商品。 ![](https://img.kancloud.cn/f8/ba/f8bad3bd39f532972861b94ee00f3894_1606x782.png) ![](https://img.kancloud.cn/c8/ff/c8ff0a8c0cae1542d09ebed75115e386_1612x781.png) ***** # 抽奖 添加抽奖组件后,在右侧编辑栏中,编辑展示样式,选择抽奖活动商品。 ![](https://img.kancloud.cn/93/66/93665956fc7908b9fb06c83e5891f4b9_1613x771.png) ![](https://img.kancloud.cn/af/2c/af2c0cd1f0a0cadade44be9bbbe8e190_1599x780.png) ***** # 空白块 添加空白快组件后,在右侧编辑栏中,编辑空白快的颜色和大小 ![](https://img.kancloud.cn/dd/e6/dde6f88fb8e6b3beadc152b8a8d68cda_1612x744.png) ***** # 流量主广告 添加流量主组件后,在右侧编辑栏中,添加流量主ID ![](https://img.kancloud.cn/29/6d/296d151ec7af7483ab9b2c61a49dcc23_1618x741.png) 流量主在小程序后台------推广----流量主 中申请开通 ![](https://img.kancloud.cn/5a/8b/5a8b2c142882b40602ae594ca67e3121_1621x799.png) ***** # 弹窗广告 用户进入商城后弹出的广告页面(可设置仅首次弹出和每次进入弹出) 添加弹窗广告组件后,在中间商城页面点击弹窗广告,在弹出框内设置弹窗广告 ![](https://img.kancloud.cn/32/36/3236f26e5df32c8d37b402d8238dbe87_1617x793.png) ![](https://img.kancloud.cn/2c/f2/2cf2068470ac689dbbc83d7f5b54261e_1618x787.png) ***** # 快捷导航 添加快捷导航组件后,在右侧编辑栏中,编辑导航样式以及内容 ![](https://img.kancloud.cn/fe/c1/fec185fe0b5d1de68f45482c77e16b35_1620x764.png) 选择“使用商城配置”则默认使用商城中的配置(系统管理----商城设置----图标设置) ![](https://img.kancloud.cn/e7/27/e727ff9f0972fd4e3ea5f086d4a0ceef_1618x730.png) 移动端位置 ![](https://img.kancloud.cn/a9/73/a973b9a9e240ab87338c859c784273a0_805x750.png)