HUGO

Images not showing on github with Ananke theme

Hi. I created a portfolio using the Ananke theme and I included images using the {{< figure src=“image_path” title="'title">}} format. It worked fine on my local server but when I host on Github, none of the images are showing up. The featured images are working just fine, but all of the other images don’t work. Here’s the link to my repository https://github.com/Ay-slim/Portfolio-Website Here is a link to one of the pages with the image not showing https://ay-slim.github.io/Portfolio-Website/certifications/ Any help would be appreciated

Hi …

your image path rel URLs need to be checked …

I checked an image … and the broken link URL is …

https://ay-slim.github.io/images/Coursera_DL.png

but it needs to be

https://ay-slim.github.io/Portfolio-Website/images/Coursera_DL.png

so maybe in your markdown file you have to check the path?

Alternatively - check your base url in your config file is set as …

https://ay-slim.github.io/Portfolio-Website/

1 Like

Hi thanks for your response. The base URL was correctly specified in the config file. Also, I specified all the image paths as “/image/Coursera_DL.png”.

Also, I noticed that there is no recent posts summary on the main page like with the ananke example, it only displays the welcome message. Could these two problems be related?

This is a screenshot of my config.toml page. I strongly suspect it’s where the issues are coming from. Please let me know if something looks out of place here.
Like I said, it works fine locally, but not after hosting.

I’m also wondering if trying to change the image paths in the public html and xml files may help but I don’t want to break things. What do you think?

Thanks again for responding.

Hi — this was all working fine when you run hugo server -D on your local machine?

The config file looks ok - so if the server / local version is running fine … then I think you have setup your Github Pages incorrectly.

Each user is entitled to 1 site at a url like https://ay-slim.github.io - this is stated on the help pages

https://docs.github.com/en/github/working-with-github-pages/about-github-pages

You can create a project github page with a url like https://ay-slim.github.io/Portfolio-Website/

Did you follow Github instructions on setting up a project ?? see the same help page – where it says

Project sites can also be published from the master branch or a /docs folder on the master branch. To publish your site from one of these sources, you must configure a different publishing source. For more information, see “Configuring a publishing source for your GitHub Pages site.”

1 Like

Hi. Yes, it was all working fine. I’ve gone through these pages and nothing seems wrong with my use of Github. Still works perfectly on my local machine right now. I want to email github support and see if they have any suggestions. Thank you so much for your time and help.

Did you check your Github account and the repo - to be sure that it is setup as a project or organisation repo?

If you are using your personal Github account - then I believe you have to follow the https://ay-slim.github.io structure

Good luck

1 Like

In config.toml, try:

canonifyURLs = true

instead of:

canonifyURL = true

And while the body’s open:

  1. Remove metaDataFormat; it was removed a year ago.
  2. Make sure the other entries are consistent (spelling and case) with the documentation

The case of the settings shouldn’t be problem, but don’t risk it. If the documentation states to TypeItLikeTHIS, then TypeItLikeTHIS.

1 Like

Thank you so much! Deleting the metaDataFormat and using canonifyURLs = true did the trick. It works perfectly now. Thank you again.

Hi, I appreciate your help with this. the issue was from the config.toml file and @jmooring’s suggestion helped to fix it. Thanks a lot, I’m grateful.

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.