Twenty Fourteen Theme – Header Removal/Entry-Header

1 Views

I’m fairly new to WordPress/CSS/PHP and I’m having a few issues when designing the company intranet. As a design brief I was asked specifically to use only the primary sidebar as a navigation menu, leading me to remove the main/top menu.

I am currently using the code:

Read More
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
display: block;
}
header {display: none; !important
}

Within a child theme to successfully hide all headers, unfortunately I’ve reached a point where I actually need to use the “entry-header” class in the featured content window to show the titles.

I am very happy with all other titles staying hidden as I’ve done a lot of my styling around this.

Basically, all I’m wanting to do at this point is keep everything else hidden whilst only showing the entry-header on the featured content section. I hope this makes sense! Thank you very much in advance for your help.

Unfortunately the site is hosted internally so I can’t provide a link to show what I mean!

Post Views: 1

Related posts

Leave a Reply

2 comments

  1. There should be a file named header.php

    Inside there should be the “top header” where the nav is contained, etc., that you want to hide. It should have an ID or a class along with, if it does not, give it one. For example…

    <header>

    Could be edited to be…

    <header id="top-header"> or <header class="top-header">

    Then, in your CSS, change…

    header {display: none !important; }

    To this if you are using an ID…

    header#top-header { /*code*/ }

    OR this if you are using a class…

    header.top-header { /*code */ }

    The above is the more “proper” way of hiding those items, although in the interest of site speed, if you arent using those headers at all, simply delete them from header.php. (be careful of any wrapping div’s that end in footer.php”)

    Off the top of my head, the 2014 theme has an ID attached to the top element already that you can re-use.

    Alternatively, you could just “undo” the styling for the entry-header… Though at this point it would be considered bad practice. To do this… Right beneath the header line you already have in your css, add this:

    header.entry-header { display: inline !important; }

    Make sure that the above code is directly AFTER the code you are using to hide all headers. It will not work if it is above.

    Again, i caution you however, that this is not best practice. Hiding all headers, then unhiding the ones you want isn’t the best way to code. This would be called an exception, and you are forcing yourself into writing potentially multiple exceptions any time you run across an instance where you want to see .

    Also, simply setting them to display: none; does not mean they are REMOVED from the page. Only hidden from view to users. Google bot will still see and read any content inside those hidden elements. This could potentially be very bad for your SEO.

  2. If you want the .entry-header to be visible on only the featured content page, you’ll have to use a conditional statement in the featured page template to enable the header to be displayed on that page alone.