Search code examples
http-redirectgithubgithub-pages

Static resources not loading on GitHub Pages


I have created a website and am trying to host it on git hub pages. My site is available at -

http://<username>.github.io/<project name>/

But the static files for my site are available at the following path -

http://<username>.github.io/css/site.css
http://<username>.github.io/script/main.js

The above path omits the <project name>

So whenever I hit the url my static files are not loaded.

Is there a way to make it work with the github url?

Note: When I use a custom domain everything works fine because the relative paths are fine in that case.

Temporary Solution I have created a User page instead of a Project page to overcome this issue.


Solution

  • From the documentation to setup a custom domain:

    Warning: Project pages subpaths like http://username.github.io/projectname will not be redirected to a project's custom domain.

    This means that due to the relative paths you can either have the assets on your username.github.io/project-name or on your custom domain.

    If you want them in the github one check what the documentation says about the baseurl configuration, it's at the bottom of the page, in the "Project Url Structure". It's simple you just need to add a

    baseurl: /project-name
    

    row to your _config.yml and use the {{ baseurl }} tag in your permalinks, jekyll will do the substitutions. And to test it locally just run the server with this option

    jekyll serve --baseurl ''
    

    Hope it helps :) Happy coding!