Image is not displayed after site deployment while shown locally

Here is my site, and there is an image. I use it here. When I run hugo server everything looks fine:

But after deployment I get just git man text instead of the actual image. I don’t get where things go wrong to fix it.

What is the deployment URL?

Do u mean baseURL?


No, I want to look at your deployed site.

Then here it is.

You are deploying your site to a subdirectory.


Now open your browser’s dev tools and look at the console:

The image destination in markdown is /git.jpg which is relative to the root of the server.

1 Like

You are deploying your site to a subdirectory.

So… Is it the right way to do things or not? I mean what should I change then? I wanna just refer to images as I do now (and change something else).

Use page bundles.

hugo new about/

β”œβ”€β”€ about/
β”‚   β”œβ”€β”€ git.jpg
β”‚   └──
β”œβ”€β”€ posts/
β”‚   └──

Then use a page-relative destination in markdown:

{{< image src="git.jpg" alt="git man" position="center" style="border-radius: 4px;" >}}
1 Like

You’ll need to contact the theme author to fix the other stuff that’s broken.

And change the baseURL in your site configuration to:
1 Like

I am not surprised that I break things at the first hours of usage, it’s a usual situation. :laughing:

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