All links missing repository name in URL

This should be an easy one for someone who really knows Jekyll for Github Pages. Thanks in advance for your help and insights.

I have closely followed the Jekyll “Step-by-Step Tutorial” to create my site. I have published the site and see the message: “Your site is published at https://qyoom.github.io/DenseBlend/”. The home page links properly the first time, but all subsequent links are to my “account” site, or are 404. The reason is that the repository name (DenseBlend) is missing from the path in all URLs. If I add it to the URL manually in the address bar the page is served correctly.

Example:
The URL should be:
https://qyoom.github.io/DenseBlend/projects.html
But the actual generated URL is:
https://qyoom.github.io/projects.html
This happens to all of my links (URLs).

My vague guesses are:
It has something to do with the Gemfile settings? Source?
Or there is someway to use the relative_url filter in Jekyll/Liquid?
Or there is just some configuration or step I’m just missing or doing incorrectly.
Very complicated!!
Thank you! I’d like to be able to get past this one.

Hi @Qyoom, welcome to the GitHub Support Community!

You’re right that this is an issue with Jekyll and how it generates your asset links, and that you can fix it using the relative_url Jekyll filter!

This problem is caused by how you’re referencing your assets inside your templates:

Because you’ve included the initial / inside this URL the browser that loads the page looks at the root of the domain for this file path, meaning it looks at the following URL:

https://qyoom.github.io/assets/css/styles.css

instead of the actual URL you want, which is:

https://qyoom.github.io/DenseBlend/assets/css/styles.css

You could fix this by removing the initial / from your asset links but this would only fix these links for pages on the top directory level, meaning if you had pages inside a folder the relative asset links would be broken there.

The best way to fix this would be to use the relative_url filter on these asset links to tell Jekyll to prepend the baseurl of your site—the repository name—to all these asset links:

<link rel="stylesheet" href="{{ "/assets/css/styles.css" | relative_url }}">

Once you replace any asset links with versions that include this filter your CSS, JS, and other assets should load correctly.

1 Like