h1’s on front page with Genesis

If you’re building a website for a business, chances are they won’t have the homepage display a listing of blog posts. WordPress lets you easily change this default behavior in Settings > Reading, so you can set a static front page and have your posts page be elsewhere (better than using the Genesis blog template).

Genesis has the site title up in the header, and it uses a <p> tag everywhere except the posts page, which uses an <h1>. This is because singular content (individual posts and pages) have an h1 title right above the post content, and archives (ex: tag, category…) have an optional “Archive Headline” option which lets you put an h1 above the post listings.

When you specify a static front page, the page title and content will now appear on your homepage. But most of the time developers will replace this home content with something else. Orย they’ll leave the homepage content butย remove the page title since “Home” seems redundant. You might see these in your theme’s front-page.php:

Removing the page title

<?php
// Remove post title area
remove_action( 'genesis_entry_header', 'genesis_do_post_title' );
remove_action( 'genesis_entry_header', 'genesis_entry_header_markup_open', 5 );
remove_action( 'genesis_entry_header', 'genesis_entry_header_markup_close', 15 );
view raw front-page.php hosted with ❤ by GitHub

Removing the loop

<?php
// Remove the loop
remove_action( 'genesis_loop', 'genesis_do_loop' );
view raw front-page.php hosted with ❤ by GitHub

But now your homepage doesn’t have an h1! The solution is to modify the site title in the header to use an h1. In the past this was a bit complicated, but Genesis 2.2.3 added a filter that greatly simplified it. You can now filter genesis_site_title_wrap to change the element that wraps the site title.

In your front-page.php file, add this:

Make homepage site title an h1

<?php
/**
* Use h1 for site title
*
*/
function ea_h1_for_site_title( $wrap ) {
return 'h1';
}
add_filter( 'genesis_site_title_wrap', 'ea_h1_for_site_title' );
view raw front-page.php hosted with ❤ by GitHub

And if you’re using my Genesis Title Toggle plugin to remove the page title from the homepage, there is now a checkbox to “Make the site title an h1” when editing the homepage.

Bill Erickson

Bill Erickson is a freelance WordPress developer and a contributing developer to the Genesis framework. For the past 14 years he has worked with attorneys, publishers, corporations, and non-profits, building custom websites tailored to their needs and goals.

Ready to upgrade your website?

I build custom WordPress websites that look great and are easy to manage.

Let's Talk

Reader Interactions

Comments

  1. Thanks, Bill! ๐Ÿ™‚

    …I’d really be interested in seeing the custom WP dashboards you make for clients sometime!

    – Sean

  2. Hi Bill
    my name is Luca and I’m Italian. First of all congratulations for the site and the myriad of information it contains. I would be grateful if you could help me with a problem that match to the Genesis Title Toggle plugin. The plugin eliminates the h1.entry-title class, which means, as I use to comfort a few pages as a “template blog” to filter categories (cat num = **) as well as adding a specific slider at the top of the page, the plugin also eliminates all titles of items displayed as “preview” the page, that is, it also eliminates the <a href =. How can I fix?

    http://www.naturalive.it/business/

    Thank you

    • First, I recommend you don’t use the Genesis blog page template. But if you must, when editing that page you can add back the title just for that page. Assuming you’ve disabled the page titles sitewide (in Genesis > Theme Settings), there will be a metabox with a checkbox that says “Show Title”. If you have not disabled them sitewide, then in that metabox uncheck the “Hide Title”.

      • hi Bill, maybe I explained wrong … the problem is that if I disable the title for the page are deactivated all the titles of the articles in preview on that page … I would turn off ‘only’ the title of the page and not of the articles inside.

        • Because you are using a page template, the plugin is (properly) removing all the page titles on that page. The Genesis Title Toggle plugin will not work in the way you want. You’ll need to create your own blog page template that doesn’t include the main page title.

          • Hi Bill, I’ve got the same problem. I installed your great little plugin only to find that the post titles on my Blog page have disappeared. Interestingly, when I untick the title toogle box on the page called blog the problem still exists. I know I’m missing something here, but I don’t know how to create my own blog template. Cheers, John

          • I realise the error of my ways now. The check box on Genesis > Theme Settings was ticked so all titles were hidden. I’ve unchecked that box and now use the check box in the actual page to hide the title or not. Thanks John

  3. so if I understand it, I advice not to use the blog template (as in your article dont-use-genesis-blog-template) who is now page_blog.php (as recommended by Genesis support) with this inside:

    <? Php
    // * Template Name: page_blog.php My Blog
    // * Show page content above posts
    add_action ('genesis_loop', 'genesis_standard_loop', 5);
    genesis ();

    but to create a home.php page inside this?

    <? Php
    // * Template Name: home.php (blog page)
    genesis ();

    and set it in Genesis settings such as blog page.
    correct?

    Any idea to remove "only" the main title?
    <? Php
    // * Template Name: home.php (blog page)
    // * Erase first page title!
    remove (??????????????????)
    add_filter(??????????????????)
    genesis ();

    thanks ๐Ÿ™‚

  4. Hi Bill!

    can the site description be filtered instead to output a ‘h1’ on the front page?

    the Genesis SEO settings allow the option to make the site description a h1, which is great, as most people have their keyword as the site description, not the site title (site name).

    but when using Yoast SEO, this feature is lost and the site description on the front page goes back to a ‘p’

    I have looked everywhere, but no one seems to have a solution

    thanks in advance ๐Ÿ™‚

    • ahhh, I worked it out!

      add_filter( ‘genesis_site_description_wrap’, ‘front_page_h1_site_description’ );
      function front_page_h1_site_description( $wrap ) {
      return ‘h1’;
      }

  5. Hi Bill, thank you for this article. It was easy to find after noticing the second check box when I was editing my site’s home page. Is there a reason the h1 check box is not showing on other pages like About, Contact, etc? Thank you!

    https://lauratucker.com

  6. LOL Bill, I just scrolled up to the top of the page and re-read that it’s “h1โ€™s on front page with Genesis”
    It’s all good ๐Ÿ™‚

Leave A Reply