Changing Navigation on Theme

[pearcy]

Hi,

I am learning Ghost and am loving it. I installed a local copy and have been able to add, edit and change most everything. I followed several online tutorials but need help figuring out how to make the navigation consistent (the theme uses a slightly different version of the navigation for the “index” page vs. the rest of the site). The goal is to create a static home page without posts (I figured this part out) and a consistent navigation on all pages.

My steps:

** editing with VS Code on a Mac. Using CL for stop, start, etc.

1. Created a home.hbs page (copied the index.hbs and removed the “posts”.
2. Added to the routes.yaml file
   routes:
   /: home
3. Page is showing fine but I can’t figure out how to change the navigation.
4. I learn by doing and want to edit the handlebar files directly (not interested in injecting code from GUI).

Current Page

Here is the navigation that I would like the page to have (logo on left) on the “home” page.

Questions:
a. Should I be editing in the “Content”/Themes"/“Casper”/ folder or the “Current”/“Content”/Themes"/“Casper”/ folder. This is very confusing to someone who is new. Why two seemingly duplicate repositories?
b. I tried replacing the “header” code with the the “page.hbs” code but it doesn’t do the trick (blank top part of page).

   <header class="site-header">
<div class="outer site-nav-main">
    <div class="inner">
        {{> "site-nav"}}
    </div>
</div>

Any suggestions would be greatly appreciated.

[pearcy]

I tried to take a slightly different approach and I believe I am closer to getting what I need. Using a different theme ( liebling - which has a consistent navigation on all pages), I was able to create a static “home” page that is acting like I would expect it to. The only problem is that I can’t direct it to the root / directory.

Editing theme in this directory
⁨ghost3⁩ ▸ ⁨content⁩ ▸ ⁨themes⁩ ▸ ⁨liebling⁩
routes.yaml file is in this directory
⁨ghost3⁩ ▸ content⁩ ▸ ⁨settings⁩
(in my first post using the Casper them it was in ⁨current → content⁩ ▸ ⁨settings)

Here is my current “home” page that is at the root /.
http://localhost:2368

And I was able to create a new “home” page which shows up at:
http://localhost:2368/home/

I would like the “home” page (http://localhost:2368/home/) to show up at the root directory (http://localhost:2368)

I did try to change the routes.yaml file per this tutorial but it didn’t work.

How to build a custom homepage for your Ghost theme

Tried these two settings to routes.yaml (based on two different articles I read)

routes:

/:
data: page.home
template: home

collections:
/blog/:
permalink: /blog/{slug}/
template: index

taxonomies:
tag: /tag/{slug}/
author: /author/{slug}/

and this:

routes:

/:

collections:
/blog/:
permalink: /blog/{slug}/
template: index

taxonomies:
tag: /tag/{slug}/
author: /author/{slug}/

And I did make the changes several times, stopping/starting ghost each time to make that the changes took effect.

the “home” page that is working was created via the admin GUI

I also created a home.hbs page (copy of index.hbs file) but I couldn’t make it show up at the root level.