Trying to get the "return home" link in the jekyll theme to be different depending on the page

Help
1

I have an github guide to our software and home link in the layout goes to the main directory. Which works fine for the main guide, but I want to separate some of our guide pages from the rest of the guide. So people using the Demo guide won’t get access to the full version guide.

Essentially I just need this link in the default.html:

 <div class="inner">
          <a href="/operationGuide" class="code"><span>Home</span></a>
</div>

to use this link when it is on certain pages. If it helps, those pages would all be in the DemoGuide folder of the repo.

 <div class="inner">
          <a href="/operationGuide/DemoGuide/" class="code"><span>Home</span></a>
</div>

I have bare bones HTML knowledge, I only learned to use markdown so I can edit these guides.

2

Jekyll is a static site generator, which means you can do all sorts of conditional things before the site builds but not after. I think you want the site to check and see if the customer belongs behind a paywall. Is that correct?

If my assumption is correct, you will have to do one of two things (that I can think of):

  1. Put your site behind some role-based solution, such as what Netlify describes
  2. Put the docs for the paid content in another Jekyll site that some authentication provider protects

If I misunderstand your request, please provide some more detail.

3

No sorry, I’m just trying to separate these two pages. No protection or paywall.

All I wanted to do was have the “home” link be different for a few specific pages. But the home link is part of the Jekyll theme. I just want to either overwrite the theme for a few pages, or have the link be conditional based on what markdown page it is showing on.

4

Okay, thank you for that. The easiest way to handle what you are looking for is to use a little Liquid logic in the area where you create the Home link. You can inspect the URL and see if it contains a specific word.

Your original code looks like this:

<div class="inner">
  <a href="/operationGuide" class="code"><span>Home</span></a>
</div>

With new code that looks at the page.url and determines the link, like this:

./your-menu-code.html

<div class="inner">
  {%- if page.url contains 'DemoGuide' -%}
    <a class="page-link" href="{{ "/DemoGuide/index.html" | relative_url }}">Home</a>
  {%- else -%}
    <a class="page-link" href="{{ "/" | relative_url }}">Home</a>
  {%- endif -%}
</div>

To make the code more reusable, you can add two variables to your config.yml file that allow you to pattern match:

./_config.yml

# Put these lines anywhere you want
demo_guide: "DemoGuide"
demo_guide_url: "/DemoGuide/index.html"

Then you can modify your menu code like this:

./your-menu-code.html

<div class="inner">
  {%- if page.url contains site.demo_guide -%}
    <a class="page-link" href="{{ site.demo_guide_url | relative_url }}">Home</a>
  {%- else -%}
    <a class="page-link" href="{{ "/" | relative_url }}">Home</a>
  {%- endif -%}
</div>

Important: If you are testing locally, do not forget to stop and start Jekyll after you modify the _config.yml

Of course, you could get more advanced and look for a specific word that is not in the filename, etc. but this is how you can get started.

Consider Jekyll Collections

If you are not already doing so, you might want to seriously consider using Jekyll Collections for your documentation. That will make your life easier and you do not have to worry about inspecting the URL and you can also use other features useful for documentation.

Below is a link to the documentation for collections. Please note that it talks about creating a list of post authors, but keep your mind open to the idea that you could create a collection of Demo Docs and a collection of API Docs, etc.

5

Thank you very much, I was able to get this to work by checking the url for “Demo”.

6

Great! Do keep in mind you might want to make sure that logic doesn’t mess anything up if the word “demo” ever appears in the URL’s. For example you could search for /demo/