Images from Hugo not displayed on GitHub pages

Question

I am trying to deploy a personal site built with Hugo to GitHub Pages. In that page, I want to put some images.
Here is the published page, with an image missing after the line In the table of contents, it is the “parent” of the other articles inside the folder. (you can see the alt text in there)
https://zq-psk.github.io/ssg/docs/hugo/articles/

The URL looks fine to me, I checked if all lower/uppercase is OK, including the extension.

It works locally, on localhost as well as when deployed as a static site.
Here is my GH repository: https://github.com/ZQ-PSK/ssg
The "docs" folder is where GitHub pages takes the files from.
The "content" folder is the Markdown source.

This may have something to do with my Hugo config, I noticed that links to articles that I enter in MD also don't work.
I tried different combinations of "baseURL" and "relativeURLs" in Hugo config and it doesn't seem to help in any way.

Do you have any advice? Is there some way I can make absolute URLs that work locally as well as on GitHub Pages?

Answer 1

I decided to give up and try a simpler approach.

Moved all my images to one folder at the top of the site's directory hierarchy, and now I use absolute URLs instead of relatives. It seems to do the job.

https://github.com/ZQ-PSK/ssg/commit/472b87c6c4cc591bca3e6c9c4ca4f7ff059e0912

Answer 2

Not sure if it's too late. But you can fix this by adding canonifyURLs = true in your config.toml file.