For a resent project I wanted to add a widget area below the header and have it display on all pages except the homepage. I’m calling it the “Page Title Widget Area”.
This tutorial is for use with the Genesis Framework and a Genesis Child Theme.
Here is a screenshot of what it looks like, the red box is highlighting the widget area.
This is a really simple setup. You just need to be able to edit three of your theme files, functions.php, home.php, and style.css.
Step 1:
We need to register the new widget area and get it to display in the correct location, below the header.
This code also adds the appropriate class to the widget area for styling purposes.
Add the following code to your themes function.php file.
Step 2:
Because I already have several widget areas on the homepage, I did not need the Page Title widget to show up in the homepage. This code will remove the Page Title widget area from the homepage of your website.
Add this code to your themes home.php or front-page.php file.
Step 3:
This code will style the widget area like you see it in the screenshot at the top of this page. Feel free to edit it as needed.
Add this code to your themes style.css file.
Now, when you go to the widgets section of your WordPress dashboard you will see a new widget area titled, “Page Title”.
Add the desired widgets to the new widget area and you’re done.
If you have complications or need assistance, feel free to use the comments or chat below.
Done-For-You Service
Want us to fix it for you!? If you don’t want to waste time with these tech issues, we’re happy to do-it-for-you! You can feel confident knowing you’ve got an expert fixing it for you!
Skip to content
This is so awesome! Thanks so much! I have some mystery padding or margin at the bottom that I can’t seem to pinpoint with Firebug. Any thoughts? I really appreciate you posting this!
Hey Jane,
I’m glad this tutorial was helpful!
I could take a look at the site and see if I could figure out the extra space.
Are you using a Genesis child theme or building a custom one?
Talk soon,
Chris
Just to clarify, does the:
remove_action( ‘genesis_after_header’, ‘cegg_pagetitle’ );
Need to go in the home.php file in the child theme folder?
You were talking about the child them functions.php file previously, so I wasn’t sure if we are to add it to the functions.php or to the home.php if we want to NOT show that widget on the home page.
You can add it to the functions.php file, but if you do, you’ll have to add an if statement. I put it in the home.php file so that it removes the widget area from the home page only.
thanks for haring this,
will this work on other themes ?
Ok I answered my question, It didn’t work :/
I am using ribbon theme.
Thanks
This will only work on Genesis Child Themes.
Hi! Could you tell me what to add/remove if I want this on the homepage as well?
Hi Vika,
Yes just skip step 2. The code in step 2 removes the widget area from the homepage.
Hello! Thanks for this 🙂
I have a question… What would I change if I want it to ONLY show up on the homepage?
Hi Sarah,
Step 2 removes the widget from the homepage. So first thing, skip step 2.
To accomplish your goal, you have 2 options.
Option 1:
You can take the code below (step 1 in tutorial) out of the function.php file and place it in your home.php or front-page.php file. If you don’t have a home or front-page file, you’ll have to take option 2.
//* Add the Page Title section
add_action( 'genesis_after_header', 'cegg_pagetitle' );
function cegg_pagetitle() {
if (is_active_sidebar( 'pagetitle' )) {
genesis_widget_area( 'pagetitle', array(
'before' => '
'
) );
}
}
Option 2:
Just replace the code in step 1 with the code below:
//* Add the Page Title section
add_action( 'genesis_after_header', 'cegg_pagetitle' );
function cegg_pagetitle() {
if ( is_home() ) {
genesis_widget_area( 'pagetitle', array(
'before' => '
'
) );
}
}
//* Register widget areas
genesis_register_sidebar( array(
'id' => 'pagetitle',
'name' => __( 'Page Title', 'cegg' ),
'description' => __( 'This is the page title section.', 'cegg' ),
) );
I’ve used option 2 on my test site which you can checkout here: https://demo.wpmantis.com/themehacks/
Let me know if you have any other questions.
– Chris
Great, finally something worked on genesis.
will it work on other themes?
Glad to hear it worked for you!
In theory this will work in other themes, you’ll have to change the PHP stuff. All my code is Genesis specific.
Hey there! 2019 and this still works! Thank you so much.