一、这个功能能做什么
通过文章列表与详情模块,可以把后台文章组织成资讯首页、杂志页面、下载目录或图片分享站,并逐项调整图片、文字、筛选与互动展示。
文章列表的 15 种布局
同一批文章可以采用不同展示方式。选中文章列表模块,在「内容设置 → 布局样式」中选择:
| 布局 | 展示效果与适合场景 |
|---|---|
| 网格 | 多列图文排列,适合常规文章首页和分类列表 |
| 卡片网格 | 以独立卡片组织图文,突出每篇文章 |
| 列表 | 按行浏览,适合标题和摘要较重要的内容 |
| 瀑布流 | 适合图片比例与内容高度不同的视觉内容 |
| 日志列表 | 以日志形式展示文章,适合持续更新的记录 |
| 小红书模式 | 用相应图文样式展示内容,适合图片型分享 |
| 下载网格 | 以网格展示下载类文章及适用资源信息 |
| 下载列表 | 按列表展示资源,便于比较资源信息 |
| 下载横向列表 | 用横向条目呈现下载内容 |
| 下载卡片 | 突出资源图标、副标题和适用下载统计 |
| 多分类分栏 | 按分类分列,每栏第一篇大图、其余篇目列表展示 |
| 分类精简列表 | 以分类标题、文章标题和时间组织紧凑内容区 |
| 左二右一(杂志) | 每三篇一组,左侧两篇、右侧一篇大图;小屏时大图在上 |
| 杂志混排流 | 按顺序组合列表、全宽大图与双列网格,形成有变化的阅读节奏 |
| 横向滑动卡片 | 拖拽或点击箭头切换卡片,适合横向推荐区 |
布局决定展示形式,文章仍需有对应内容。选择下载布局不会自动创建下载地址;有资源数据时,相应信息才有内容可展示。
列表可以逐项调整什么
| 设置 | 控制效果 | 使用提示 |
|---|---|---|
| 数据来源 | 常规列表或当前内容相关 | 相关文章使用当前详情页的内容作为依据 |
| 模块分类 | 决定常规列表使用哪些分类 | 适合首页某个专题区;仍受当前站点和语言范围影响 |
| 自动 ID | 按当前分类或标签页面取得内容 | 适合归档页主体列表,不应随意用在普通首页 |
| 默认排序 | 综合、最新、热门、评论、点赞、收藏、下载、评分等 | 页面筛选带来的排序可以覆盖初始选择;以适用内容数据为准 |
| 只显示 | 全部、下载、音频、视频或画廊 | 同一站点可以分别做视频区、下载区和图片区 |
| 热门天数 | 配合热门排序控制适用时间范围 | 与默认排序一起检查 |
| 总数量 | 控制列表读取数量 | 分类分栏中表示每栏篇数;不同布局含义需结合说明 |
| 每行最大数量 | 控制一行或一屏的数量上限 | 窄容器下还受最小卡片宽度影响 |
| 最小卡片宽度 | 页面变窄时自动减少每行数量 | 适合同时照顾电脑、平板和手机 |
| 分页或加载更多 | 改变浏览后续内容的方式 | 部分杂志和分栏布局不使用底部加载更多 |
| 自动加载更多 | 适用布局滚动到底部时继续加载 | 页面中部模块谨慎使用,避免列表持续占据页面 |
| 标题 | 调整行数、字号与粗细 | 长标题可限制行数,让卡片更整齐 |
| 摘要 | 调整显示、行数与字号 | 图片展示区可少放文字,教程列表可保留说明 |
| 标签数量 | 限制每篇显示的标签数 | 避免标签过多挤占内容空间 |
| 作者与时间 | 选择作者头像、名称、发布时间等展示项 | 适合多作者网站和资讯内容 |
| 互动统计 | 选择浏览、评论、收藏、点赞等适用展示项 | 隐藏展示不等于删除统计数据 |
| 内容信息条 | 展示下载、音频、视频或画廊等适用信息 | 选择默认位置或图片上的位置 |
| 下载专属字段 | 适用布局显示大小、类型、属性、更新时间、评分、下载数 | 不同下载布局提供的展示项不同 |
| 缩略图显示 | 通过展示项决定是否显示图片 | 标题型列表可隐藏图片,作品型列表可突出图片 |
| 缩略图类型 | 选择适用的常规或切换形式 | 可选项与当前布局有关 |
| 缩略图占满 | 调整图片是否占满对应区域 | 与留白、比例一起观察 |
| 缩略图圆角 | 调整列表图片的转角 | 与整个模块的容器圆角分开设置 |
| 缩略图宽度 | 控制适用布局中图片所占宽度 | 在横向图文中平衡图片和文字 |
| 缩略图尺寸 | 选择服务器提供的缩略图、中等、大图或原图等版本 | 小卡片通常无需使用原图 |
| 缩略图比例 | 控制图片区域高宽比例 | 此项用“高÷宽”;正方形填 1,16:9 横图约填 0.56 |
| 杂志混排列表图片 | 单独控制列表项图片开关、宽度和比例 | 大图和双列卡片沿用网格图片设置 |
| 卡片内边距与间距 | 调整内容留白和卡片之间的距离 | 与模块容器内外边距分别作用 |
| 横滑箭头与位置 | 显示切换按钮并调整位置 | 箭头移到模块外侧时应留出足够空间 |
文章详情的展示能力
| 模块或设置 | 可以做到什么 |
|---|---|
| 文章标题区 | 选择适用的标题区信息,结合正文、作者、分类、标签等独立模块组织详情 |
| 文章 Banner | 选择常规、模糊或轮播样式,设置比例、图片尺寸和适用宽度 |
| Banner 轮播控制 | 设置切换按钮、按钮位置与指示器 |
| 资源下载模块 | 提供默认、游戏下载(简约)、下载资源(清晰版)、下载资源(紧凑版)、下载资源(属性版)五种布局 |
| 下载展示项 | 选择相应资源信息,配置图片、支持说明的图标文字与链接、背景 |
| 视频模块 | 设置是否自动播放;开启后以静音方式开始,用户可手动打开声音 |
| 音频模块 | 选择适用音频展示信息,配合后台的音频与权限配置 |
| 画廊模块 | 设置图片尺寸、每行上限和最小卡片宽度 |
| 评论模块 | 控制评论表单与列表展示,选择默认或瀑布流布局,设置每页评论和回复数、字数限制、间距及加载方式 |
| 互动模块 | 使用横向图标行或右侧悬浮轨展示适用互动按钮 |
| 打赏模块 | 设置货币或积分打赏、预设金额、自定义金额及支持者头像数量 |
| 相关文章区 | 添加文章列表,数据来源选择「当前内容相关」,再选择需要的列表布局和展示项 |
| 文内目录 | 用目录模块关联正文模块 ID,从正文的二级至四级标题生成导航 |
二、设置后会有什么效果
同一批文章可以在首页做杂志混排,在分类页用紧凑列表,在详情页显示相关文章。下载内容可以突出资源类型、大小和评分,图片内容可以突出特色图;无需为每种版式重新录入一套文章。
三、怎么使用
配置文章展示的顺序
- 打开目标前端的构建器,选择首页、文章归档或文章详情模板。
- 添加或选中文章列表模块,先确定数据来源,再选分类或启用归档页的自动 ID。
- 选择布局与展示项,再调整排序、数量、加载方式。
- 调整图片、标题、摘要和卡片留白;整个模块的圆角与边距到「容器设置」中调整。
- 配置文章详情时,分别添加标题、正文、下载、媒体、评论与相关文章等需要的模块。
- 保存并按项目的发布流程更新前台,分别查看电脑宽度和手机宽度,以及不同语言、分类的实际内容。
四、常见问题
为什么相关文章在首页没有内容?
「当前内容相关」需要一篇当前内容作为依据,应放在详情页使用。普通首页没有对应内容 ID,应使用常规列表和分类筛选。
为什么选了每行四篇,手机上只有一两篇?
每行数量是上限。容器变窄并达到最小卡片宽度后,会自动减少列数,避免每张卡片被挤得太窄。
为什么改了圆角,文章图片没有变化?
先确认改的是「缩略图圆角」还是「容器设置 → 圆角」。前者控制图片,后者控制整个模块外框;两项需要分别设置。
为什么切换布局后,部分展示项或加载按钮不见了?
不同布局提供的展示项不同。例如下载布局突出资源信息,分类精简列表只保留少量字段;多分类分栏和左二右一杂志布局不使用常规底部加载更多。按当前布局提供的选项配置即可。