Hugoでイメージギャラリーを実装する方法を調べていたところ、hugo-shortcode-galleryというのがお手軽で良さそうだった。

mfg92/hugo-shortcode-gallery: A theme components with a gallery shortcode for the static site generator hugo.

インストールするとgalleryというショートコードが使えるようになる。以下が実例。

このページがあるディレクトリにimagesというディレクトリを作成して画像を置き、ショートコードのパラメタにmatch="images/*"と書き、その他、必要なパラメタを指定するだけで、こんなサムネイルを表示してくれる。

インストールもthemeディレクトリでcloneしてconfig.tomlを修正するだけなので簡単だ。

{{< gallery match=“images/*” sortOrder=“desc” rowHeight=“150” margins=“5” thumbnailResizeOptions=“600x600 q90 Lanczos” showExif=false previewType=“blur” embedPreview=true loadJQuery=true >}}

これらの画像はロードオブザリングの世界観をMidjourneyで表現したもの。いやーこういう画像作るのは楽しい。時間が溶ける笑