Modify CSS in The Toujours Theme

• 

  memven · Member · Apr 7, 2016 at 5:57 pm

  • Copy link
  • Add topic to favorites

  I like the simplicity of the Toujours theme. It works for me. I have a large hero Image I want on the header image on the first page only. I want the other pages to NOT have a hero image. Is there a way to make this happen?

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · Apr 8, 2016 at 12:22 am

  • Copy link

  Hi there, I see you have used the following to hide the header image on all but the home page.

  body.page-id-3 .site-branding {
      display: none;
  }
  body.page-id-4 .site-branding {
      display: none;
  }
  body.blog .site-branding {
      display: none;
  }

  That works, but you will need to do that for any pages that you add. What I might suggest would be the following. What this does is to hide the header image everywhere and then bring it back on only the home page. This way if you add additional pages to your site, they would be covered by this CSS.

  .site-branding {
      display: none;
  }
  .home .site-branding {
      display: block;
  }

  As I said, what you have works great, but if you think you will be adding more pages in the future, this may be a better solution for you.

• 

  memven · Member · Apr 8, 2016 at 12:35 am

  • Copy link

  Thanks!

• 

  thesacredpath · Member · Apr 8, 2016 at 12:36 am

  • Copy link

  You are welcome.