Hugo Narrow 支持图片点击放大功能,使用 PhotoSwipe
库创建灯箱,同时支持 justified 布局、Masonry 布局和 grid 布局。使用原生 markdown 输入即可创建图库。
提示
图库相关参数可以在文章 frontmatter 覆盖设置。
图库参数
params.yaml
1gallery:
2 enabled: true
3 defaultLayout: justified # justified, masonry, grid
4 gap: 10
5 targetRowHeight: 200
6 lastRowBehavior: center # left, center, right, fill, hide
7 columnWidth: 200
8 columns: 4 # auto 或具体数字
9
10# PhotoSwipe 灯箱
11lightbox:
12 enabled: true
13 bgOpacity: 0.8
14 showHideAnimationType: zoom
15 showAnimationDuration: 333
16 hideAnimationDuration: 333图库使用
直接使用 markdown 方式引入图像资源,每行一个资源链接,中间无空行的图像组视为同一个图库。 下面的示例为两个图库,第一个图库包含两个图像资源,第二个图库包含三个图像资源。
MARKDOWN
1
2
3
4
5
6