For a site I’m working on I needed a way to hide the post title, but only on specific posts. This particular post was a quote with a big image on top, and it looked better with the image, but no heading text.
Google brought me a few options, but I ended up doing it myself.
My first thought was to look for a plugin. And sure enough there’s one called Hide Title which seemed like a perfect fit.
And it was so close. It added a meta box to the post edit screen where you could toggle whether you wanted the post title to show.
The other common solution was to add custom CSS for each post.
When WordPress builds a page it adds a CSS class
postid-ID for each single post, where ID is replaced by the actual ID. For example, the post with ID of 123 would have
postid-123 as one of the CSS classes in
body. We can use this to target the title. This does make an assumption that your page title has the CSS class
page-title, although most themes do this.
Here’s the CSS you’d want to add to your theme to get the title on post 123 to hide.
The problem here is that I’d have to do this for every post. For now there’s just the one. But this would get pretty tedious.
What I ended up doing was using the
wp_head action along with custom fields to automatically add the CSS when needed.
What this does is look for a custom field named
hide_title. If that field exists, it will output a bit of CSS in the header, but only if it’s in the single view. I didn’t want to also strip out the title on archive pages since the title is usually also the link to permalink.
Now when I want to hide a title I just add that custom field with any value and the title won’t show up.
Where it goes
I put the code in the
functions.php file for the theme I’m using.
I also put together a quick plugin on GitHub if that’s easier.