Must all images be in the static folder

It depends on the theme, the baseURL, etc.

If I were starting from scratch, creating my own layouts/theme…

Images related to a single page should be placed in a page bundle:

content/
├── posts/
│   ├── post-1/
│   │   ├── c.jpg  <-- page resource
│   │   ├── d.jpg  <-- page resource
│   │   └── index.md
│   ├── post-2.md
│   └── _index.md
└── _index.md

Images that can be used anywhere on the site should be placed in the assets directory:

assets/
└── images/
    ├── a.jpg  <-- global resource
    └── b.jpg  <-- global resource

And to make this setup work when adding images to your Markdown, enable Hugo’s embedded link and image render hooks in your site configuration:

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

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

The content/posts/post-1/index.md file would look something like this:

![a kitten](images/a.jpg) 

![another kitten](c.jpg)

Note that Hugo’s embedded link and image render hooks are automatically enabled for multilingual single-host sites.

3 Likes