A static blog generator with multiple image directories

892 views Asked by At

Question: what software should I use to achieve a static site generator like described below?

I'm looking for a static blog generator, which... generates static blogs, of course :). However I need something more, like a nice set of themes to choose from, and, what is even more important, a specific way of managing assets.

When I write articles/posts/text, I create a new directory. Then inside I have a file like article.md, or article.textile. I also have files with code, and pictures, and charts etc. Everything is inside this one directory. Then I used to run a tool to convert it to html, and copy the html to a website for publishing. However there was always a problem with images. I had to copy the images somewhere e.g. to Wordpress and then change the image urls in the html. This is not the best way to do it.

I'd like to have a static blog generator, which would let me keep my normal structure: one directory per post, and keep all the images from the directory in generated structure, so I can have relative paths to the images.

I really don't like the idea to keep all articles in one global directory, and all images in another global one.

I've checked jekyll, and pelican so far, and read about couple others, but I haven't found any solution to that problem. I know that, as usually, you will have many nice ideas to check.

And of course I know that most probably this post will be "closed and not constructive", or with any other funny explanation, but maybe someone will manage to post any solution before that.

4

There are 4 answers

0
Zombo On

Hugo can do this. cd to empty folder of your choice, then create the scaffolding:

hugo new site .

After that you can put your content in content, example:

content
  post
    alpha
      index.md
      1.jpg
      2.jpg
    bravo
      index.md
      1.jpg
      2.jpg

Build site:

hugo

Result is generated in public folder:

public
  post
    alpha
      index.html
      1.jpg
      2.jpg
    bravo
      index.html
      1.jpg
      2.jpg
0
Nicolas Hoizey On

I also want my posts to be "self contained", text content and image assets being in one single folder. I'm using Jekyll.

I have made this possible with a Pull Request on the great jekyll-picture plugin.

I can then use the simple {% picture my-image.png %} syntax to show the image in my post that is in the same folder.

Here is an example: https://github.com/nhoizey/nicolas-hoizey.com/tree/master/_posts/2015/06/19-mon-jeu-esviji-integre-a-framagames

0
matrixanomaly On

Jekyll does not explicitly enforce a rule about where to put your assets like images with the exception that Jekyll will not copy files directly in a folder beginning with an underscore. Although the general practice would be to put all images in the \assets\ directory, you can put it anywhere else other than the _posts\ directory, which is what you wanted.

This is the default behavior, but there are ways to get around this:

  1. Have your posts live outside the _posts directory

Put all your posts outside the default _posts folder along with the images (this will copy all the files without any YAML frontmatter, and preprocess all the files with the YAML frontmatter). However, any other function you can do with posts automatically in Jekyll won't work anymore. This may or may not be an issue.

  1. Plugins

    • Here's a plugin (link to SO question) written specifically for making Jekyll copy files in the post directory. If you do use this you can definitely just write the following Markdown and it'll link relative to the post as it should. :

      • ![Image title](my_image_filename.png)
    • Jekyll asset path plugin is another robust plugin that does something similar, but does not keep your images in one directory, it does however link images relative to your post title though.

    • Jekyll asset pipeline is another another plugin that handles CSS and JS, which might be something you want to have in conjunction with plugin 1.

Do note however that the use of third party plugins is not supported with GitHub Pages site generation, meaning you will have to generate them in another branch or locally, and then pushing the static HTML files to master. This might be an issue for you if you're planning to host with GitHub Pages, else on your own server instance you're good to go.

0
Nicolas Hoizey On

One year after my previous answer, I have now developed a Jekyll plugin that helps keep posts assets alongside the Markdown file, it might fill your needs: https://nhoizey.github.io/jekyll_post_files/