图示：左侧为产品系列分类导航，右侧为“按系列排列”的产品展示，鼠标悬停在产品图上可切换展示其他图片。
图示：左侧为产品系列分类导航，右侧为“按参数排序”的产品展示，以表格形式清晰列出各产品的详细规格参数。
图示：左侧为产品系列分类导航，右侧为常规的“正常列表排列”，以简洁的列表样式展示产品。
适用于产品线丰富、系列繁多，需要清晰分类与多样化展示的制造业、科技、消费品等行业：
| 行业类型 | 典型使用场景 | 价值体现 |
|---|---|---|
| 工业设备与制造业 | 展示不同系列、型号的机床、仪器仪表。通过“按参数排序”模式，方便工程师、采购人员快速对比技术指标。 | 某机械设备厂商：官网产品查询效率提升70%，技术咨询转化率提高30%。 |
| 消费电子与家电 | 展示手机、电脑、大家电等产品系列。通过“按系列排列”的图片轮换，多角度展示产品外观与设计细节。 | 某手机品牌：新产品线页面用户停留时长增加50%，视觉吸引力获用户好评。 |
| 建材与家居 | 展示不同系列的地板、瓷砖、橱柜等。左侧分类清晰划分产品系列（如按风格、材质），右侧“正常列表”或“图片轮换”展示。 | 某家居建材公司：经销商与终端用户选品更便捷，线上样本库作用显著。 |
| 汽车与零部件 | 展示不同车系、配置的车型或零部件。综合运用三种模式，既展示外观内饰图片，也提供详细的参数配置表。 | 某汽车配件商：产品信息呈现结构化、专业化，B端客户下单决策周期缩短。 |
特别适合SKU数量多、产品之间存在明确系列/参数差异，且需要引导用户高效筛选和对比的B2B或B2C官网。
固定分类导航+动态内容区的设计，使得海量产品信息的架构一目了然，用户无需跳转页面即可完成系列筛选与内容浏览，路径极短。
一站式提供三种主流产品展示布局，可针对不同产品特性（如外观导向型、参数导向型）选择最合适的展示方式，展示专业度大幅提升。
图片悬停轮换功能，在有限空间内提供了更丰富的视觉信息，激发了用户的探索兴趣，提升了页面的互动性与吸引力。
尤其是“参数排序”模式，将复杂的技术参数表格化、并列对比，极大地方便了专业用户进行横向比较，加速其决策过程。
在网站编辑器中，找到并添加“产品列表（分类导航）”模块到目标页面。
在模块设置中，绑定对应的产品数据源。配置左侧导航分类，通常可关联产品后台已设置好的“产品分类”或“产品系列”。
在模块样式中，从“按系列排列”、“按参数排序”、“正常列表排列”三种模式中选择一种。不同模式下可进一步配置图片尺寸、参数字段、排序方式等。
若选择“按系列排列”模式，需在产品管理后台，为相关产品上传多张展示图片，以支持前台的鼠标悬停轮换效果。
若选择“按参数排序”模式，需在产品管理后台，完善各产品的规格参数信息，确保前台能正确提取并表格化展示。
保存模块设置，在编辑器内预览效果。点击不同的左侧分类，检查右侧产品列表是否正常切换与展示。确认无误后发布页面。
用户访问页面时，点击左侧不同分类筛选产品。在“按系列排列”模式下，可将鼠标悬停在产品图上查看多角度图片。
长按屏幕识别二维码
打开手机扫描二维码
