Hide Pages bar in Manifest theme

• 

  hellonedman · Member · Feb 25, 2014 at 3:31 am

  • Copy link
  • Add topic to favorites

  Hi everyone,

  I’d like to make two CSS adjustments to my blog, but I’m not sure how.

  First, I’d like to eliminate the “Pages” bar completely. I don’t have any pages I want to link to, and it’s distracting from the header image.

  Second, I’d like to change the size of the header image, making it a bit taller. The image file is 400 pixels high but it got cropped in the import.

  Is there any way to accomplish this? Thanks!!

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

• 

  thesacredpath · Member · Feb 25, 2014 at 4:37 am

  • Copy link

  Hi there,

  First, I’d like to eliminate the “Pages” bar completely. I don’t have any pages I want to link to, and it’s distracting from the header image.

  #main-nav {
  display: none;
  }

  Second, I’d like to change the size of the header image, making it a bit taller. The image file is 400 pixels high but it got cropped in the import.

  The header will require a couple steps. First off, create a blank PNG image at 500 x 160 (transparent, no background) and upload that as your header image at Appearance > Header.

  Create and upload your new header image to the Media Library, get the URL of that image and replace URL_OF_IMAGE in the CSS below with the URL of that image.

  #header-image {
      background: url("URL_OF_IMAGE") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
      height: 400px;
  }
  #header-image img {
      height: 400px;
  }

  The reason for the blank, transparent image is so that we can keep the new header image as a home page link on your site since you are not using a standard site title.

  And, add the following CSS and go back to Settings > General and add in the site title. The following CSS will hide the site title, but keep it there in the HTML for the search engines to see (they like to find site titles on sites).

  #site-title {
      display: none;
  }

• 

  hellonedman · Member · Feb 25, 2014 at 2:14 pm

  • Copy link

  Thanks so much for the clear and easy-to-follow instruction! It worked perfectly.

  Let’s say I want to include a site tagline for search engine purposes, but also wanted to hide it visually. I’m guessing there’s a short CSS tag for that as well?

• 

  thesacredpath · Member · Feb 25, 2014 at 4:50 pm

  • Copy link

  Absolutely.

  #site-description {
  display: none;
  }

• 

  hellonedman · Member · Feb 25, 2014 at 5:01 pm

  • Copy link

  Thanks so much! You were a great help.

• 

  thesacredpath · Member · Feb 25, 2014 at 5:02 pm

  • Copy link

  You are welcome.