A common question people ask when designing a WordPress theme is “How to remove/hide the “Page Title” on my homepage?”. This is often asked in situations where a static page is being used for the Home Page. The following is
three four easy methods you can use to solve this problem:
1) Hide the Page Title with CSS
This is the most common method I see being used, but not my favourite. It works by creating a class in your theme’s style.css file, something like this:
You should replace the “post-63” bit to match the ID of your own WordPress page ID. (TechTrot explains how to find your page ID here). This works great but personally I’ve never been a fan of hidden text.
2) Remove the Page Title with a WordPress query
Using the WordPress conditional tag “
is_front_page()” you can make your WordPress theme check if the current page is the “home page” or as WordPress calls it “the front page”.
The query you should place into your theme’s page.php file looks something like this:
<?php if (is_front_page()) : ?> <?php else : ?> <h1 id="post-<?php the_ID(); ?>"><?php the_title(); ?></h1> <?php endif; ?>
In the example above you could display for example an image instead of the Page Title, but for me I generally keep it blank.
3) Change the Page Title with a Plugin
A plugin I love using is the very powerful Page Lists Plus. With this plugin you can control the Page Title text that is displayed in your navigation menu (Page lists generated by
wp_list_pages()). This becomes very handy, as it means your Static WordPress Page Title of your homepage could be “Welcome to my website!” but in the Page Lists Plus plugin you can use the alternate text field with “Home”.
It’s not always perfect but can be very handy not only in this use but for other situations too.
4) Delete the Page Title with Page Templates
As a rough guide to do this, follow these steps:
Go to your theme directory via FTP, download and make a copy of the
page.phpfile and rename it to something like “
page-notitle.phpfile and add to the very start of the document some code to identify it as a template:
<?php /* Template Name: Homepage (No Title) */ ?>
Next, browse through the document until you find
the_title()– this is the area that displays the page title. For example, it would be fine to remove the following (but your theme may differ!):
<h1 class="title"><?php the_title(); ?></h1>
Save and Upload your new
page-notitle.phpfile to your theme directory.
Now return to your WordPress admin area and edit the page you’re using for the homepage. On the right hand side under the Publish panel you’ll see Page Attributes > Template, and select the “Homepage (No Title)” option. Update the page and you’re all done.
With this method you have a page template that can also be used in other area’s of your website.
What Do I use?
I’ve used all of the above methods over various websites, but most recently I’ve been aiming to removing the Page Title completely via the conditional tag method (#2). The best solution for you will depend on your web design, layout and structure.
If you have another method I’d love to hear about it via comments below