I found this post very helpful in getting my Markdown relative links to correctly link to other markdown files in my /posts directory. I expected the following in layouts/_default/_markup/render-image.html to make it so images would render
Well I get .Destination from the Hugo documentation I was just trying to to the analogous thing for images to what @pavelbinar did for links, replacing .Destination with (.Page.GetPage .Destination).RelPermalink
It seems to render images in the static directory fine with with .Destination with both safeHTMLAttr and safeURL, but neither fix the problem with not being able to display images with relative links.
I wondered why my articles in folders (I guess these are the page bundles?) were not working with this structure until I renamed the file to index.md. For portability, Hugo should consider supporting this structure.
You can get portable Markdown content + images by using
Hugo Mounts (needs the Hugo Modules feature, and so you need to have a recent version of go installed on your system. Installing go is simply downloading and extracting its installation archive file in your $HOME/go.). See the mounts config in the config.toml in that repo.
You can mount any of the Hugo components like content and assets from any directory in the repo to the location that Hugo expects. So you can have images referenced in your Markdown content be mounted to the global resources directory assets i.e. You don’t have to use the leaf bundle approach and rename the content files to index.md.
Use render-image.html hooks. See its example here in that repo.
These hooks allow you to have Markdown style image links in your content. The hooks can do the lookup of referenced images using the Hugo resources API (because the mounts above mounted all your images in the resources directory assets).
That’s the gist of how this works. But read up more on Hugo Mounts and image render hooks in the Hugo documentation, and clone that example repo and tweak it to better understand how these features work together.
and I’m not sure what you want is actually possible. If you made articles-about-stuff a directory and moved articles-about-stuff.md to articles-about-stuff/index.md with the image.jpg in articles-about-stuff/ leaf bundle it would definitely work.
The specific output structure you mention may require a specific input structure. I think this is a case where I need to defer to @jmooring