Image in the post does not appear

[CicoZhang]

If I set the image URL like this:

image = "img/portfolio/railroad-forest1.jpg"

It won't appear because the rendered URL is http://localhost:1313/post/work5/img/portfolio/railroad-forest1.jpg

I think the right URL should be http://localhost:1313/img/portfolio/railroad-forest1.jpg.

Maybe I do something wrongly?

[pks111607]

I used the following directory structure:

site
  |--content
    |--post
      |--some-directory-heading
        |--index.md
        |--railroad-forest1.jpg

Images seem to be relative to the directory, so the image URL would simply be:

image = "railroad-forest1.jpg"

Perhaps you have a different use case?

[tmess567]

Caused by
0c596f1

I reverted the changes in my fork and it works.
https://blog.tusharmishra.in/

[brorio]

Hm, to me the simplest solution seems to be @pks111607. Why revert changes then?

Maybe there is a need for better documentation. I will look in to this.

[fleaz]

Just ran into the same issue with this theme.
Imho keeping the content and the images separated is the cleaner and also more intuitive way to go. With the current codebase the header image would be in the content/posts/ folder, whereas all images used inside the post would still be in static/.

Therefore I'm also running a fork where the mentioned commit is reverted.

[tmess567]

Netlify-cms (which I use for authoring content) defaults to a static directory.

Configuration options are listed here.
Netlify-cms configuration

[scottyw]

I ran into the same issue, which brought me here too.

I'm finding the exampleSite to be broken at the moment, plus the live demo on themes.gohugo.io seems to show the same problem: https://themes.gohugo.io/theme/hugo-nederburg-theme/

[appernetic]

Ok, I will try to see if this would work.

In config settings

# Unmark to use post folder for images. Default is static folder.

#UsePostImgFolder = true

In templates image tags:

{{if isset .Site.Params "usepostimgfolder"}}data-background="{{ .Permalink }}{{ .Params.image }}{{ else }}data-background="{{ .Params.image | absURL }}"{{ end }}

This way it will work as before and if you want to have images in the post folder you unmark the seetings in the config file if you have it there.

[appernetic]

Pushed!

So from now on just add usepostimgfolder = true to the config.toml file under [params] if you want a non standard set-up, eg use post folder for images. Simple as that :-)

[fleaz]

Sounds good. Thanks for the fix :)

[scottyw]

Thanks @appernetic! I just tried your changes with success.

[appernetic]

It still does not seem to work on Hugo Themes and there is other weird issues with links there.