Is it possible to generate a new page for every image in a folder?

support
1

The Why: I’d like to use Hugo to make a better website for some webcomics my friends are making. (I’m aware there are webcomic hosting sites out there, but we just want our own website for now.)

The Conundrum: Since each comic page is essentially the same (first/prev/next/last navigation), it doesn’t make sense to me to make a page for each one. Rather, I’d love to just drop the images in a folder (properly named, of course!) and have Hugo spit out a page for each one from a common template.

Is this feasible? If I’ve missed a similar question somewhere, please let me know!

1 Like
2

Is it possible to generate a new page for every image in a folder?

No, it is not.

3

But it would not be hard to write a script that generates a markdown file for each image and then run Hugo to generate the site.

4

I took another script I made for a customer and adopted it for your use case. Something like this should work for you.

#!/usr/bin/env python3
"""
Generates a markdown files for each image.
"""

import argparse
import os
import re
import unicodedata

from datetime import datetime
from pathlib import Path

parser = argparse.ArgumentParser()
parser.add_argument("source", type=str, help="Path to the image directory.")
parser.add_argument("out_dir", type=str, help="Output directory for the generated markdown files.")
args = parser.parse_args()

source = args.source
out_dir = args.out_dir


def slugify(value):
    value = str(value)
    value = unicodedata.normalize('NFKD', value).encode('ascii', 'ignore').decode('ascii')
    value = re.sub(r'[^\w\s-]', '', value).strip().lower()
    return re.sub(r'[-\s]+', '-', value)


def write(content_path, imagename, filename, created_date):
    file = open(content_path, 'w')
    print('---', file=file)
    print(f'title: {filename}', file=file)
    print(f'date: {created_date}', file=file)
    print(f'image: {imagename}', file=file)
    print('\n---\n', file=file)


def main():
    created_date = datetime.now().astimezone().strftime("%Y-%m-%dT%H:%M:%S%z")
    with os.scandir(source) as entries:
        for entry in entries:
            if not entry.name.startswith('.') and entry.is_file():
                filename = entry.name.split('.')[0]
                md_filename = slugify(filename)
                content_path = Path(f'{out_dir}/{md_filename}.md')
                if not content_path.is_file():
                    write(content_path, entry.name, filename, created_date)


if __name__ == '__main__':
    main()
2 Likes
5

I’ve considered a similar kind of site. If I were starting a new comic (meaning I didn’t have tons of pages already), I’d use a sub-directory approach, and then front matter cascade (Front Matter | Hugo) to set my defaults, and just drop the relevant images in each directory; this approach also works with multi-page/image layouts, where a “chapter” of pages is released or gathered together.

Then I’d do something similar to: hugo new comic/2021-09-24/index.md, and drop images in content/comic/2021-09-24. Of course it could be chapters or names or whatever instead of date in the path. And if I need to override the front matter, it’s available (in my experience of hosting comics for friends, there will be a time they want to treat a single image differently, so I plan for it ^_^).

I also like the method @frjo shared.