如何购买
1
登录您的BeikeShop商城后台
2
点击右上角“插件市场”
3
选择需要购买的插件
4
购买&安装
插件描述
Product Waterfall 商品瀑布装修模块
概述
Product Waterfall 是一个为商城后台「设计 → 装修」功能增加商品瀑布流展示模块的插件。选择一个商品分类作为「专辑」，前台以瀑布网格形式展示该专辑下的商品。商品卡片自带折扣角标（X% OFF）、原价划线与「省 ¥X」标签。前台先展示第一排商品，点击「查看更多」按钮可逐批加载下一排商品（加载次数可配置），全部展示完毕后按钮自动跳转到所选专辑分类页。非常适合用于首页爆款推荐、限时促销、专辑商品展示等场景。
主要功能
🌊 瀑布流分批加载
| 特性 | 说明 |
|---|---|
| 专辑选择 | 选择一个商品分类作为专辑内容来源 |
| 分批加载 | 首屏只展示第一排，点击「查看更多」逐批展示下一排 |
| 加载次数配置 | 可设置 1~10 次加载（每排一次），总商品数 = 每排数量 × 加载次数 |
| 自动跳转 | 全部商品展示完毕后，按钮自动跳转到该专辑的分类页 |
🛒 商品卡片特性
| 特性 | 说明 |
|---|---|
| 折扣角标 | 自动计算折扣百分比，以品牌色旗形角标展示（X% OFF） |
| 价格展示 | 现价 + 原价划线 + 「省 ¥X」标签，清晰呈现优惠力度 |
| 登录后显示价格 | 遵循系统设置，未登录时可隐藏价格 |
| 图片悬停放大 | 商品图片悬停时平滑放大 |
📐 丰富的配置选项
| 配置项 | 说明 |
|---|---|
| 标题 | 模块主标题（支持多语言） |
| 简短描述 | 模块描述文字（支持富文本） |
| PC每排数量 | 可设置 2~6 列 |
| 移动端每排数量 | 可设置 1~3 列 |
| 加载次数 | 可设置 1~10 次，总商品数上限 60 个 |
| 查看更多文案 | 自定义按钮文字（支持多语言） |
| 模块宽度 | 窄屏(container) / 宽屏(container-fluid) / 全屏(w-100) |
📋 专辑选择
| 特性 | 说明 |
|---|---|
| 专辑选择器 | 弹窗式分类选择器，支持搜索 |
| 自动解析 | 自动拉取专辑封面、标题和跳转链接 |
技术特点
-
✅ 瀑布式分批加载：首屏展示第一排，点击按钮逐批加载，减少首屏加载时间
-
✅ 响应式网格：PC 端 2~6 列，移动端 1~3 列，自动适配
-
✅ 折扣角标自动计算：根据原价与售价自动计算并展示折扣百分比
-
✅ 「省 ¥X」标签：直观展示每件商品节省的金额
-
✅ 智能价格显示：遵循系统「登录后显示价格」配置
-
✅ 淡入动画：新加载的商品卡片带有淡入上浮动画
-
✅ 按钮智能切换：有未加载商品时加载更多，全部加载后跳转到分类页
-
✅ 任意主题兼容：前台视图由插件自带，商品卡片复用当前主题组件
-
✅ 装修编辑器完美支持：实时预览，专辑选择器支持搜索
适用场景
-
首页爆款商品推荐
-
限时促销活动展示
-
专辑/分类商品展示墙
-
新品上市瀑布流
-
无限滚动替代方案（分批加载，体验可控）
