There’s several different ways to add custom sidebars to your theme.
- You can use a plugin like Genesis Simple Sidebars
- Or you can hand code a custom sidebar for your home page
In 2 simple steps, i’ll show you how to add a custom sidebar to the front page of the Metro Pro theme by StudioPress using the Genesis Simple Sidebars plugin.
Step 1 – Create Custom Sidebar
Install the Genesis Simple Sidebars plugin and create a new sidebar adding the unique i.d for the slug front.
Step 2 – Add PHP Code To functions.php
Please copy the PHP code and paste it at the end of your child themes functions.php file.
Optional Step – Change Content & Sidebar Widths
You might also like to change the width of both the content area and sidebar on your front page which you can do using this CSS code in your child themes style.css file.
.home .sidebar {
width: 380px;
}
.home .content {
width: 660px;
}
Use On Other Themes
This solution should work on any StudioPress theme using a home.php or front-page.php file.
Based on testing, the above solution will work regardless of whether your child theme includes the code to force a full width or content sidebar layout.
Some themes may require you to modify the CSS for your front or home page.
This post is based on this question from the StudioPress community forums:
Hello, I am customizing the Metro Pro theme and would like to know how to replace the Primary Sidebar on the Home page with a Custom Sidebar that appears on the Home page only.
Was This Tutorial Helpful?