Filterable gallery images

I’d like to have a gallery page (/gallery) that lists all images with a menu to filter those images by category (/gallery/:category).

A single image can belong to one or more categories. I have about 15 categories total and hundreds of images.

Here’s an example of what I’d imagine my _data/images.yml file might look like:

- src: IMG_4567.jpg
  caption: Brick wall.
  categories: structures, masonry-walls

- name: IMG_1234.jpg
  caption: Stone texture.
  categories: textures

Are collections (for the categories) and data files (for the images) the way to go here? Also, how would I retrieve images by category?


In theory collections would be the way to approach this, but currently they aren’t on par with _posts in terms of categories and tag support. There have been talks to align collections, posts, and pages in Jekyll 4.0 but I don’t think any work has been done yet.

The other limiting thing is how Jekyll currently supports categories. The way you have them defined above won’t really attach the object to multiple categories. Jekyll views categories: foo, bar as foo being the parent and bar being the child category. So you’d get a permalink link /foo/bar/.

1 Like