How to make brand logo appear ALSO on home page

Themes
1

I’m using the default Casper theme. The brand logo (the mini version next to the header links) won’t appear on the homepage, yet when I navigate to links in the header, the brand logo is there, right next to to that header.

Here’s an example of what I’d like the header to have, wherever one is within the website, including “home”:

non-home.pic

I’d like the mini brand logo to appear also on the home page, but I’m not sure how to go about it. After some research and experimentation I have some ideas… are any on the right track?

  • change something in the screen.css file to make this item display
  • change something in the default.hbs file
  • change something in the routes.yaml file

Any help would be great.

2

Hi @bcdumont87,

This seems to be set in CSS, so you can overwrite it from code injection:

<style>.home-template .gh-head-logo { display: block; }</style>
1 Like
3

Thanks a million! That worked.

I have a follow up question:

The logo is now pretty close to “About”, whereas on the other pages there’s more space.

Pic:
pic

How might I try going about this? I’ve tried injecting this directly after what I’ve already injected:

<style>.home-template .gh-head-inner { grid-gap: 2.5vmin; }</style>

but nothing changes.

4

You could add a little margin after the logo, enhancing the original code to this:

<style>.home-template .gh-head-logo { display: block; margin-right: 2rem; }</style>
1 Like
5

Thanks! Works great.