WordPress : Customize Genesis header

Zackskeeter picture Zackskeeter · Sep 16, 2013 · Viewed 14.1k times · Source

I am just diving into the Genesis Framework.

In a normal theme, if you want to edit the header, you'd open the header.php file.

But in genesis, the header file is not in the child theme. I have looked around and found a way to add custom header support, but i need some guidance.

The code below is to enable custom header support. I assume this goes into the functions.php file. But how to i actually add code here? What if i want to say pull in a custom field, or add a div to this section, or bring a slider in? How to i actually use this code to let me add html and php into the child theme header?

/** Add custom header support */
add_theme_support( 'genesis-custom-header', 
    array( 'width' => 960, 'height' => 100, 'textcolor' => '444', 
          'admin_header_callback' => 'minimum_admin_style' ) );

Answer

bilcker picture bilcker · Sep 17, 2013

First you need to remove the header that is currently there. All of this goes into functions.php in your child theme

remove_action('genesis_header','genesis_do_header');

Then is it as simple as building a function to act as your new header.

function injectHeader() { ?>
    <div id="title-area">
    <h1>Title Here</h1>
    <nav>Nav Here and so on</nav>
    <p>You can add whatever you want</p>
    </div>
<?php }

I normally try to use the same class and ID names so I can preserve some of the built in styles and save myself some work but that's up to you. All you have to do is add whatever you want in the function and call it back in like this,

add_action('genesis_header','injectHeader');

Hope that helps!