Scroll to top
USA
651 N Broad St, Suite 206,
MiddleTown, New Castle,
Delaware - 19709
Canada
635 Ashprior Avenue,
Mississauga, Ontario,
Canada - L5R3N6
India
34, Shiwanshu Bunglows
Vadodara, Gujarat - 390007

How to Display Different Sidebars for Each Post and Page in WordPress

72 / 100

Sidebars display information that is not a part of the main content. They’re not always a vertical column: It can be a horizontal rectangle below or above the content area, footer, or header. Think about the placement of navigation menus and display ads.

Sidebar placement is a critical part of UX/UI design; Overcrowd it, and you lose your audience thanks to clunky navigation. Do it right, and you’ll have visitors navigating your site with ease. 

display different sidebars for different pages on wordpress

Before we get into the debate of whether left or right is better, let’s get into how we can actually create sidebars on our WordPress website.

WordPress shows the same sidebar on all posts and images by default. However, different websites have different goals when it comes to design: Vogue’s website layout won’t be the same as the New Yorker’s. Why? Because it all comes down to the way users process certain kinds of information — icons vs. photography vs. text.

There are two ways we can create sidebars in WordPress: Through a plugin or a piece of code. If you’re comfortable and have played around with code in the past, go ahead with the code route. If not, try a plugin.

Displaying Different Sidebar using Code

Add a sidebar to the theme template

In your WordPress theme template, add the following code where you want the widget area to be:

<?php 

global $post; 

dynamic_sidebar( 'widget_area_for_page_'.$post->post_name ); 

?>

Register the sidebars for each page in functions.php

Add the following lines of code to register the sidebars for each page on your site. Depending on the number of sidebars you want to create, you need to copy the code and change the id name

function myTheme_registerWidgetAreas()
{ // Grab all pages except trashed
$pages = new WP_Query(Array( 
'post_type' => 'page', 
'post_status' => array('publish', 'pending', 'draft', 'auto-draft', 'future', 'private', 'inherit'), 
'posts_per_page'=>-1 ));

// Step through each page 
while ( $pages->have_posts() ) { 
$pages->the_post(); 

// Ignore pages with no slug
if ($pages->post->post_name == '') continue;
// Register the sidebar for the page. Note that the id has
// to match the name given in the theme template

register_sidebar( array( 
'name' => $pages->post->post_name,'id' => 'widget_area_for_page_'.$pages->post->post_name, 'before_widget' => '','after_widget' => '', 'before_title' => '','after_title' => '', )); 
}
}
add_action( 'widgets_init', 'myTheme_registerWidgetAreas' );

Displaying Different Sidebar using Plugins

There are several plugins out there that’ll help you create sidebars for your WordPress website. Regardless of the plugin you choose, the steps are the same. Two plugins you can try are Unlimited Custom Sidebars and Easy Custom Sidebars.

easy custom sidebar plugin for wordpress

Easy Custom Sidebars plugin Setup:

  1. Install and activate the plugin
  2. Go to appearance and click on sidebars; You’ll be directed to the Create New Sidebar page.
  3. Name your custom sidebar, and then click on the create sidebar button. 
  4. Pick the theme sidebar that will be replaced by the custom sidebar.
  5. Select the area where you want the custom sidebar to show on your website and click on the Add to Sidebar button
  6. Click on Save 
  7. To add widgets to the sidebars, go to appearance and click on Widgets.
  8. Go back to the selected pages and refresh those pages to see the newly added sidebars

WP Uber is a WordPress management service for freelancers, entrepreneurs, and businesses.

Author avatar
Tim Michaels
I am into WordPress and web development for the last 10 years. I use my experience to help people just starting with WordPress. Follow my blog at WP Uber for everything related to WordPress.
We use cookies to give you the best experience.
Do NOT follow this link or you will be banned from the site!