A unique looking home page is often a desired look. This tutorial will be similar to Jen Baumann’s tutorial How to Show a Different Sidebar on Specific Pages only specific to the home page. One other sidebar quick tip, if your looking for unique sidebars elsewhere on the site you can also try Genesis Simple Sidebars plugin (which does not work for the home page).
In order to accomplish this, you will need to:
- Register a new sidebar in your child theme functions.php
- Create a new sidebar file for your child theme
- Add a function to your child theme functions.php
Step 1 – Register a new sidebar in your child theme functions.php
In this example, we want to replace the Primary Sidebar with a new Primary Sidebar on the home page. Since these pages are home page related, we will name our new sidebar widget area, “Home Sidebar”.
1 2 3 4 5 6 | // Register a new sidebar genesis_register_sidebar( array( 'id' => 'home-sidebar', 'name' => 'Home Sidebar', 'description' => 'This is the home sidebar widget area.' ) ); |
Make sure that you name your sidebar something appropriate to where your new sidebar will be located.
Step 2 – Create a new file inside your child theme directory called sidebar-home.php
Paste the following code into that file, making sure the name of the sidebar is the same as the one you registered in Step 1.
1 2 3 4 5 6 7 | <div id="sidebar" class="widget-area"> <?php genesis_before_sidebar_widget_area(); dynamic_sidebar( 'Home Sidebar' ); genesis_after_sidebar_widget_area(); ?> </div> |
Step 3 – Add a function to your child theme functions.php
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | add_action( 'get_header', 'child_sidebar_logic' ); /** * Add Home Sidebar * * @author Brian Lis * @link http://dev.studiopress.com/add-unique-sidebar-to-home-page.htm */ function child_sidebar_logic() { if ( is_home() ) { remove_action( 'genesis_after_content', 'genesis_get_sidebar' ); add_action( 'genesis_after_content', 'child_get_home_sidebar' ); } } /** * Retrieve our unique home page sidebar. */ function child_get_home_sidebar() { get_sidebar( 'home-sidebar' ); } |
Hey, thanks for a clearly written tutorial. I’m having trouble getting this to display my widget content on the home page though. I’m using the Education child theme, and I don’t see the widget contents show up. Any Ideas??
Dan first question is are you using the Genesis version of the Education child theme. Next question, you’re seeing the widget area on the widgets screen, just not on your home page?
We are using the Education child theme that is included with the full Genesis package. And yeah, I can see the widget area on the widgets screen.
Thanks!
I managed to figure out what was causing the issue with my implementation of this technique.
It looks like we need to follow a slightly different naming convention when creating a sidebar template file. Since we declare the sidebar as “home-sidebar” we need to have a template waiting for it called “sidebar-home-sidebar.php”, and not just “home-sidebar.php”.
A simple fix, but it took some messing around to tease the answer out.
Thanks again for a good tutorial!
Oh…. Yeah I knew that. Sorry I didn’t think to ask you that. I didn’t see how you had it set-up so I didn’t think of it. Glad you got it worked out
How would I do this if I wanted to create a new Secondary Sidebar for the homepage and leave the Primary Sidebar as-is? I am using Genesis eleven40 theme, and in that theme, the secondary sidebar is the left column.
Bonnie you want content-sidebar-sidebar?
Brian, it’s sidebar-content-sidebar. But eleven40 displays it like this:
secondary sidebar | Content | primary sidebar
so in your example above, my test shows the new area on the top right, and i want it on the top left.
I’m sorry Bonnie, I’m not trying to be difficult but I still don’t understand the layout you’d like. Is it primary sidebar – secondary sidebar – content?
Sorry, I might not be explaining it well either. Here’s the eleven40 demo from studio press: http://demo.studiopress.com/eleven40/
See how the About Me is id=”sidebar”
But Archives is id=”sidebar-alt”
I want to put a custom widget in id=”sidebar-alt” – the top left
I think I understand now. You should be able to go to appearance>widgets then look for the widget area on the right called “Secondary Sidebar”. Select a widget from the middle section. Left click and drag it into the Secondary Sidebar widget area. If you use a plain text widget you can place text in there and you’ll see it on the front end. Let me know if that works.
Yes but I want to do that only on the homepage.
Ok you can use widget logic for that. http://wordpress.org/extend/plugins/widget-logic/. This will add a field to all your widgets. Expand the widget you want to use on the home page and add the following text in the Widget logic field.
is_home()
Thank you! Do you recommend that instead of Simple Sidebars?
Well, after using it – I certainly do! Widget Logic was the solution for me. Thank you so much for your help.
Sometimes when I give up, I discover the solution. I checked out the Genesis parent theme files and noticed in sidebar.php its set up as class=”sidebar widget-area”> and in the child theme php I made it was set up class=”widget-area”>. Adding the sidebar in the class solved my issue.
Thank you again for the tutorial.
I did exactly what you explained, but could not make it work on the home page before renaming sidebar-home-sidebar.php as Dan Bonomo wrote – thank you both for advice!
But: My Home page looks nice, but the rest of the blog (Genesis -> Serenity) look like a mess – navigation bars and sidebar.
Any suggestions on how that can be?
Thanks,
Ellen
Solved it! Somehow … don’t knw how, but everything looks nice now, thank you for a nice code, usable even for a dummy like me