When I published my previous post ‘Make Your Own WordPress Sidebars‘, I was asked by many readers if I know how to add custom sidebars for each category which can enable to display the advertisement or widgets related to that particular category under which the post is published.
So first of all, I created different sidebars on my own blog and through this post, I will guide you how you too can add custom sidebars for each category on your blog. This is really powerful for blogs as you can display different advertisements related to different categories and you can also have different optin-form for each category. You are clever enough to understand the benefits of it so I would not divulge myself much in to it.
So let’s start…How To Add Custom Sidebars For Each Category In WordPress?
You will have to work with codes and if you are not a techy guy, you would want to follow the steps carefully. After all I am always ready to help through comments section. Feel free to use it and let me know if you get any problem.
Step 1: Create or define a new widget
You will be working with functions.php file in this step. Open your theme’s functions.php file
Copy and paste the following code:
// Add a WordPress category sidebar register_sidebar(array( 'name' => 'Wordpress Sidebar', 'id' => 'wordpress-side', 'before_widget' => '<div class="sidebar-widget">', 'after_widget' => "</div>", 'before_title' => "<h3>", 'after_title' => "</h3>" ));
OR
// Add a Single Top sidebar above each post content register_sidebar(array( 'name' => 'Single Top', 'id' => 'single-top', 'before_widget' => '<div>', 'after_widget' => "</div>", 'before_title' => "<h3>", 'after_title' => "</h3>" ));
The first code has class=”sidebar-widget” which is the class for sidebar widget in my theme. For your current blog theme, you will have to find it from your functions.php file from your default widgets code. Most of the time, it is as mentioned in the first code. Class is used just to style the widget and take the parameters as pre-defined in the theme. No other specific reason.
The second code do not have any <div> code purely because I am not going to use it on the sidebar but I want to use that widget at the top of the post. I can use it to drive traffic to my other post as I am currently doing it as shown in the pic below or I can as well use any form of advertisement.
Please note both the above codes will create new widget. To check the newly created widget, go to Appearance > Widget section.
The widgets will be named as WordPress Sidebar and Single Top respectively.
Now that the widgets are created, we have to put the codes to display those widgets wherever we want them to display.
Step 2 : Display Widgets Wherever Needed
You will be working with single.php file in this step.
We are using single.php because this is the file which is called while displaying a single post on your blog.
First let’s define the widget “Single Top” and to do so, find the line below in your single.php
<div id="content-area">
Exactly above that code, put this code as mentioned below:
<?php if ( is_active_sidebar('single-top') ) { echo '<div id="single-top">' ; dynamic_sidebar('single-top'); echo '</div>' ; } ?>
This code will only work, if you have put something in your widget. I mean a text widget or anything in that widget. If the widget is empty then this will not be shown. So while testing this widget, ensure you put any widget within the ‘Single Top’ widget in Appearance > Widgets.
I have used above arrangement to display the banner as shown above.
Now let’s come to the main point. How to add custom sidebars depending on the category under which the post is published.
Find a code get_sidebar(); in single.php file
Replace get_sidebar(); with the following code:
<?php if ( is_category(wordpress) || ( is_single() && in_category(wordpress) ) ) { get_sidebar('wordpress'); //sidebar-wordpress.php } elseif ( is_category('seo') || ( is_single() && in_category('seo') ) ) { get_sidebar('seo'); //sidebar-seo.php } else { get_sidebar(); } ?>
In the above code, WordPress and SEO are categories of my site, hence I have used them accordingly. You can use the name of your category, slug or category ID. I prefer to use the slug of a category which is easy to find in the categories page.
Also shown above in the code is
get_sidebar('wordpress')' //sidebar-wordpress.php
This indicates that a sidebar-wordpress.php file will be called whenever a get-sidebar(‘wordpress’) is being read by the server or browser.
So we will have to create a sidebar-wordpress.php file in the root folder of your website. If you have no idea about root folder, then please check this, this page first before proceeding ahead.
If you have created a widget by the name ‘WordPress Sidebar’ then you will use the code exactly as mentioned below or else you will change the ‘WordPress Sidebar’ to the name of the widget that you defined in your functions.php file earlier.
<div id="sidebar-wrapper"> <div id="side"> <?php if (!function_exists('dynamic_sidebar') || !dynamic_sidebar('Wordpress Sidebar')): endif; ?> </div><!--side--> </div><!--sidebar-wrapper-->
The ‘sidebar-wrapper’ and “side” divisions mentioned above are specific to my theme. You will have to find out what your theme uses from the sidebar.php file
My theme’s sidebar.php starts with
<div id="sidebar-wrapper">
hence I have used the code above. Moreover, the sidebar code starts with
<div id="side">
so I have to put the main code within the id=”side” division.
Oh yeah! By the way, I discovered that there is also a FREE plugin which will do what I have just explained but it could be techy also. The plugin is available here.
I know these technical things are a bit fizzy at times but I hope I am trying to make myself clear. If not, you always have the option to raise anything through the comments section or if you want me to create the sidebars for your website categories, then I will help you do so for a small charge of $15 but I would suggest you try first before ordering.
This is a very powerful technique to get multiple streams of income and multiple ways to capture leads from the same website. Let me know in the comments how it goes for you.
While I am not one to mess with my functions files in the genesis framework, I do have a couple of sites I will try this with because I do like adding the widget wherever I feel I need them.
Doing widgets this way could negate the need for left or right side bar widgets in most wp themes, wouldn’t it? That way, you could use the full page responsive layout and only add those widgets you want to use for specific posts?
Yes, anything is possible with this technique.
Another Great post from you Keyur. Will refer to this when I need to create. Have few things I want to do. Just to to list them down and prioritize. Thanks again. Glad tosee you are doing great. To your Abundance!
Thanks for your kind words, Sandy.
Very detailed post and instruction!
I do not know why it would be an advantage to have custome side bar in each category of your website though. If you could provide insight to some of the advantages it would be highly appreciated
The advantages are many but most lucrative is that you can display advertisements or widgets related to that particular category only under which the post is published. So if you have 3 categories on your blog viz wordpress, seo and list building then you can display advertisement related to wordpress on wordpress categorized posts, seo related adverts next to seo categorized posts and list building related adverts next to list building categorized posts.
This is really powerful.
Hi Keyur,
You’re definitely a WordPress whiz! My own site is pretty simple at this stage, but I know when I’m ready to further develop it, I shall be referring to your detailed guide on various aspects of WordPress.
Thank you for sharing,
Aneeta
Thanks Aneeta. I am just trying to learn and implement and then share what I have learned. It is all about the passion.
Wow Keyur,
What a great post and a great blog! This post was super helpful and I’ve already noticed a couple of other posts that I need to check out.
I am very really techie but with your clear to follow instructions, I shouldn’t have a problem with my sidebar.
I’ve just added your blog as one to check back often and refer to as I have any blog techie questions.
Great Job Keyur!
LeslieZ
Thanks Leslie for your kind words. I would be more than happy to help anytime incase you need any help related to WordPress.
Hi Keyur, Great blog and good information on How To Add Custom Sidebars, I found just by playing around with the wordpress widgets you can find a lot ways to add banners so we can add a lot more to our websites. Could even put this into a video format to show how this works now that’s a idea. Will sure keep in touch and will look forward to more fab content!
Yes, it is fun adding sidebars and widgets and with this fun you can accomplish lot more with your site.
Hi Keyur.. I really liked the way you have gone in depth and explained each step very clearly. Keep going man.. You are the rockstar.
Thanks Muhammad for your kind words. Stay tuned to get more.
Hi Keyur,
Another gem of knowledge from you. I’ll be adding it to my file on ‘how to’s’ for when I’m ready to use it. Thank you
Alayna
Thanks Alayna.
This is a really good tutorial for people like me who does not know that much about programming!! However, would it not be better to use a plugin such as Content Aware Sidebars for this? Since I found it, I have been using it on all my sites, and it just keeps to amaze me, though it was hard to get used to at first.
Best,
Kim J
The more plugins you add, it will definitely add to the loading time and hence it is advisable to minimize the use of plugins.
I get pleasure from, cause I discovered exactly what I
used to be looking for. You have ended my four day long hunt!
God Bless you man. Have a great day. Bye
Hello to every body, it’s my first pay a visit of this weblog; this website consists of remarkable and truly excellent material in favor of readers.
I am wanting to show a custom widget below each blog post before the comments section. I want to be able to use different offers per category though. Can you tell me how I can do that?
If you don’t mind, you can provide me your WP details at keyuramin08 at gmail dot com and I can have a look at it.