Image links work on localhost, break on the server

While the site looks great when I run the hugo server command, when build the site, and copy it to our server, all the images are broken. The problem is such that if I prepend the right number of “.\.\.\” to the image using developer tools in my browser, then the image will load.

However, if I try to fix the problem by specifying a different base url in my config file, it only makes things worse The site only seems to be able to find the “Docsy” theme if I specify baseUrl = “”. If I specify the name of my website as the baseUrl, say,, many of the links will look like “”: it just appends the baseUrl to the address instead of understanding what I mean.

Is messing around with the baseUrl the right way to solve my broken images?

I am having trouble including slashes in my post. my baseUrl is set to be one backslash. The images are fixed when change the address to go a few directories up.

Essentially, if hugo could understand what my baseUrl was, I would have no problem. It would be able to find my images. But I am failing to understand how to configure this.

You are more likely to receive a prompt and accurate response if you post a link to the public repository for your project.


Let us see your code

Include a link to the source code repository of your project, because we really need the context of seeing your templates and partials to be able to help you. It is trivial to do a quick git clone on your repo, then run hugo server in your project, to help you out. On the other hand, recreating your code from screenshots, or sort of guessing at it, is not.

If you can’t share your repository for whatever reason, consider creating a dummy repo that you can share, which reproduces the problem you’re experiencing.