Skip to content

图库

图库是 WarmIsland 主题支持的照片展示模块,提供多种布局样式和分组功能,适合摄影师、设计师或任何需要展示图片集合的用户。

配置项一览

配置项类型默认值说明
photos_page_title文本图库页面标题
photos_style下拉masonry展示样式:masonry / grid / carousel
photos_columns数字3列数
photos_show_ungrouped开关false显示未分组图片
photos_show_group_title开关true显示分组标题

前置依赖

DANGER

图库功能依赖 Halo 的 PluginPhotos 插件。如果未安装此插件,图库页面将无法正常工作。

安装方式:Halo 后台 → 插件安装 → 搜索「图库」→ 安装并启用。

详细说明

页面标题(photos_page_title)

图库页面的标题,显示在页面顶部。

yaml
photos_page_title: "图库"       # 默认
photos_page_title: "相册"       # 替代方案
photos_page_title: "Gallery"    # 英文站点

展示样式(photos_style)

说明
masonry瀑布流样式,图片按原始比例错落排列,充分利用空间(默认)
grid网格样式,图片统一裁剪为正方形或固定比例,整齐划一
carousel轮播样式,图片以轮播方式逐张展示,适合精选照片

TIP

masonry 样式适合图片尺寸差异较大的场景(如混合横竖版照片);grid 样式适合图片尺寸统一的场景(如统一裁剪的摄影作品);carousel 样式适合精选少量优质照片展示。

列数(photos_columns)

控制网格和瀑布流布局中的图片列数。默认为 3 列。

  • 桌面端按设定列数显示
  • 平板端自动缩减列数
  • 移动端固定为 1–2 列
yaml
photos_columns: 3  # 默认,3 列
photos_columns: 4  # 更紧凑的布局
photos_columns: 2  # 更宽松的布局

TIP

列数选择建议:2 列适合大图展示,3 列是通用平衡选择,4 列及以上适合缩略图式浏览。

显示未分组图片(photos_show_ungrouped)

开启后,「全部」视图中会显示未分配到任何分组的图片。未分组图片区域的标题为「全部」。

关闭时,未分组的图片仅在「全部」视图中以合并方式展示,不单独标注分组。

显示分组标题(photos_show_group_title)

控制「全部」视图中是否显示各分组的标题。

  • 开启(默认)— 每个分组的图片前会显示分组名称作为分隔标题
  • 关闭 — 所有图片合并展示,不显示分组标题

TIP

如果分组较多且每个分组图片较少,建议关闭分组标题以获得更流畅的浏览体验。如果分组清晰且每个分组图片较多,建议开启以帮助访客快速定位。

内置功能

分组导航

图库页面顶部显示分组导航标签,访客可以按分组筛选查看图片。点击「全部」查看所有图片,点击具体分组名称只查看该分组的图片。

图片灯箱

所有图片支持点击放大查看,基于 LightGallery 实现:

  • 点击图片弹出灯箱查看大图
  • 支持左右切换浏览同组图片
  • 支持缩放、全屏等操作
  • Esc 或点击背景关闭灯箱

相关页面

基于 GPL-3.0 许可发布