Images doesn't display from markdown file when using Agen theme in hugo

support
1

Hi all,

I am having great annoying issue. Images cannot display on the website when I want to use in any markdown.

Even I tried to keep them in the same directory it is not working.

  1. The usage content/community/images and also the md file in the same directory content/community/policy.md. I did:

    ![logo](/community/images/logo2.png)

  2. static/images/community/logo2.png and I try to get the image in policy.md by writing: You can see from repo. I cannot share 2 images path now. The system doesn’t allow.

Normally both ways work when I don’t use any themes. Is something wrong with Agen Theme? Or am I missing something here? If someone help I would really appreciate it.

This is the PR of the code in case:
https://github.com/ospoplusplus/ospoplusplus.org/pull/21/files

And the repo branch:
https://github.com/ospoplusplus/ospoplusplus.org/tree/new_image

1 Like
2

I suggest that you start small: one image, one MD file, and a clear description of what you want to achieve, what you did, and what the outcome was.

From what I could see, you’re trying to use an image from front matter (not MD itself, though). But I have no idea where you want that image to appear. Nor tge time to figure that out.

3

Thank you for your answer but my question is not related image in the front matter they are working fine. If you look at the policy.md file:

https://github.com/ospoplusplus/ospoplusplus.org/pull/21/files#diff-b3078c151b565a9369e272eea594ac3f18bdffc803f6396622f2270950cd9cf3

and the line is:

![Our Focus](images/community/US_Policy.png "Our Focus")

you would see I try to use image from MD and it is not displaying in the website page.

4

You are serving your site from a subdirectory:

baseURL = "https://ospoplusplus.github.io/ospoplusplus.org/"

If you want to reference an image in the static directory, you must include the subdirectory from which your site is served, starting with a slash:

![Our Focus](/ospoplusplus.org/images/community/US_Policy.png "Our Focus")

It is easier to bundle your images with your content:

content/community/policy/
├── index.md
└── US_Policy.png

Then reference the image using a relative URL (no leading slash):

![Our Focus](US_Policy.png "Our Focus")
1 Like
5

Thank you so much that solved the issue.

6

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