Broken images with Zola generated feed
I use Zola—a static site engine—to generate this site. In my previous blog post, I included some images. I am a bit of a Unix purist who lives in the terminal, images are a fancy frivolity for me, but it's time to embrace modern trends and add some pictures to this blog.
I put these images in the static
directory, Zola copies the content of this directory as is when publishing. So the image located static/images/pic.jpg
got copied in /images/pic.jpg
on the site. In my blog post I referenced it with:
![My image](/images/pic.jpg)
This worked fine with the generated HTML. There was a problem with the feed though, my RSS reader couldn’t display the images; the images’ link were referenced something like this file:///images/pic.jpg
not what I wanted. I thought that RSS readers would prepend the site’s base URL to absolute links, but apparently that’s not how it works.
I checked out the source of Zola’s author site to see how I could fix this. It turns out the static directory is not intended for assets related to a specific page; it's meant for site-wide assets.
The source for the post was in a file like this: content/blog/post.md
, which works fine when there’s only text. To fix the fix the RSS feed, I had to create a directory for the post content/blog/post/
; put the source in content/blog/post/index.md
; and put the image in content/blog/post/pic.jpg
and reference the image like this:
![My image](pic.jpg)
This fixed the feed, the images are now displayed correctly by my RSS reader.