Is there a simple way to display images in hugo?

support
1

![1](../../static/images/1.png)
I put the images in static/images folder and link it like this. In vs code, I can view them, but i can’t see them when I run hugo serve and see the output at localhost:1313. WHy?

I earlier tried to put them in content/images directory and same issue occurred.

2

If you place your images in the static/images directory, and if your baseURL does not include a subdirectory, do this:

![alt](/images/image.jpg)

https://gohugo.io/getting-started/directory-structure/#directories

static
The static directory contains files that will be copied to the public directory when you build your site.

And it looks like we have answered your question before:
https://discourse.gohugo.io/t/inserting-image-into-post-by-putting-it-under-static-folder-isnt-working/49567/3

3

What should the baseurl be?

4

See docs:
http://localhost:1313/getting-started/configuration/#baseurl

5

Got it boss. This is so uninituitive. I can’t seem to see where the image is in obsidian. What I do is paste images in obsidian, set the directory to default static/images where attachments are kept. But now I need to manually rewrite the URLs.

6

Search this forum for “obsidian”. I solved this problem before… it’s a matter of configuration.

1 Like
7

Ok doing it rn. This is bookamrked.

8

Obsidian configuration:

{
  "attachmentFolderPath": "attachments",
  "useMarkdownLinks": true,
  "newLinkFormat": "absolute"
}

Hugo configuration:

[markup.goldmark.renderHooks.image]
enableDefault = true

[markup.goldmark.renderHooks.link]
enableDefault = true

[[module.mounts]]
source = 'assets'
target = 'assets'

[[module.mounts]]
source = 'attachments'
target = 'assets/attachments'

The attachments directory in the root of your project might look something like this:

attachments/
├── documents/
│   ├── a.pdf
│   └── b.pdf
└── images/
    ├── kitten-a.jpg
    └── kitten-b.jpg

Example:

git clone --single-branch -b hugo-forum-topic-49627 https://github.com/jmooring/hugo-testing hugo-forum-topic-49627
cd hugo-forum-topic-49627
hugo server

And this is a really stupid limitation in Obsidian:

https://forum.obsidian.md/t/start-absolute-path-with-a-leading-slash/32501

They need to fix that to provide compatibility between Obsidian and VS Code Markdown Preview mode.

1 Like
9

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