htmllocalhostjekyllgithub-pagesbase-url

Jekyll site.baseurl doesn't link to homepage when published via Github Page but worked in localhost

Everything's working fine when tested in localhost but after publishing to GitHub Pages, I noticed an annoying bug: clicking website's logo will always redirect to the page's link instead of the homepage (baseurl).

My code:

<div class="logo-mobile">
      <a href="{{ site.baseurl }}"><img alt="{{ site.title }}" src="{{ site.logo.mobile | relative_url }}" /></a>
</div>

For example, if I'm viewing 'About Us' at www.example.com. The website logo will link to 'www.example.com/aboutus' instead of 'www.example.com'.

My github page does have a custom apex domain and www subdomain setup with https enforced. The DNS is correctly setup as per github's guide and all the links including the menu buttons work except the logo.

Localhost does not have this issue and will always link correctly back to homepage. I can't debug it so far.

Solution

  • In this case you want to link to /, prefixed with the baseurl:

     <a href="{{ site.baseurl }}/">

    To my knowledge, site.baseurl should be empty, or not end with a trailing slash.

    baseurl:

    or

    baseurl: /subpath

    That way, you'll always link to the root path of your site with {{ site.baseurl }}/ regardless of what baseurl the site is served on.