Redirects in page not updating URL correctly when deploying from github

Hello. To all those more familiar with this technology(victor-hugo/netlify) than I, thanks in advance. When run locally on my machine the website works fine and i can navigate from “about”,“blog”, and all redirects perfectly fine. However, when I run my site from github the links do not work any longer, and I notice that the site’s url does not refresh correctly.

Example: Correct url when im on the posts section of my site is https://stephen-ivkov.netlify.app/projects/. If i try to navigate to “blog” from the “projects” section the url is now https://stephen-ivkov.netlify.app/projects/posts/

Can anyone please help? Thanks so much!
Site URL:https://stephen-ivkov.netlify.app/
Deploying from: GitHub - Macedon93/mysite: Personal Site

hey there, i think that your build settings might be incorrect.

can you pop a screenshot of them so we can take a look?

Hello! Sure thing!

image|690x489

Hi!

This seems to be a problem with a specific Hugo setting.

On the menu of the site I see this link:

<a class="navigation-link" href="posts/">Blog</a>

That means it will be followed relative to the current page. So if you are on /projects/, it will try going to /projects/posts/.

For the link to work properly on any site it would need to look like this:

<a class="navigation-link" href="/posts/">Blog</a>

Notice the leading slash. That makes the URL “absolute”, meaning it will always be applied to the bare domain.

You might be seeing this just on Netlify, because we redirect /projects to /projects/ which is to avoid having multiple paths with the same content.

It’s a general best-practice to have urls in global things (like in a menu or paths for assets) to be absolute.

How can you fix it?

I think it should be enough to have this setting in your config.toml file:

baseurl = "/"

This should make Hugo generate the correct permalinks.

How can you verify locally?

Instead of using “serve” mode, you can use hugo build to replicate what’s happening in the Netlify build process. You can open the files that pop up locally to check if the links are correct.

Well marcus that absolutely did the trick. Thank you so much for that articulate and timely explanation of how things work! Thank you so much once again.

2 Likes

@marcus is just the best! thanks for helping out! <3