Best practice to add images in the document

[AngangGuo]

What's the best practice to add images into a document?
The image files should be in the same folder as the document or in the static folder?

How's the link looks like in the document?
eg. /static/folder1/image1.jpg?
Thanks.

[McShelby]

Take a look into the exampleSite like here or here

[AngangGuo]

From the example, the image should be in the same folder as the document.

Use the image plain name as the relative path in markdown document:
![Magic](magic.gif)

[gmiejski]

From the example, the image should be in the same folder as the document.

I've tried numerous way and it doesn't work for me :/

• I'm using hugo v0.114.0
• not using any module overwrite except of:

[module]
[[module.imports]]
path = "hugo-theme-relearn"

When I use hugo server -w
images in the same directory as the content page are not loaded by
![something](my.png)

I have troubles finding the best way to inject images into my page, can you help?
I need it to work both with hugo server and when deployed at Netlify.

The only solution I've found so far is:

1. place images at /static/images/some_dir/file.png
2. load it with ![file](/images/some_dir/file.png)

Is there any simpler way to do this @McShelby ?
Thanks a lot!

[McShelby]

This depends on your site structure. Having images in static like in your example works and is okay.

Otherwise you need to get acustomed with the differences of branch bundles (_index.md), leaf bundles (index.md) and simple pages (anyotherpagename.md) - a general Hugo concept

You are only allowed to have images in your page*s directory if it is a branch or leaf bundle.
Images are only allowed to reside in subfolders of your page's directory if it is a leaf bundle.
No images are allowed for simple pages.

While often working, you are not allowed to link to images of a other pages.

See this themes exampleSite for examples.