Wordpress Tutorial: Create Post-Specific Sidebars Using Custom Fields
Published: ,
Looking for a way to add more sidebars to your Wordpress blog? Want to be able to create and assign a unique sidebar to one individual blog post? Take this easy 3 step tutorial and change the dynamics of your WordPress forever. Learn how to create not only one dynamic sidebar, but as many as you want. Have sidebar content targeted to individual posts using custom fields.
Up until recently I was at peace with my WordPress theme sidebar setup. However, as I added more content and some posts started to receive more traffic than others, I felt a growing need for post-specific and individually targeted sidebar content. Using three separate tutorials I managed to create a new sidebar for one specific post publication, and customize the sidebar for optimal Adsense earnings and visitor interaction. Now I am making a staggering $3 a week on Adsense, a 300 % increase, thank you very much!
Step 1 - Registering new sidebars
It is in functions.php the sidebar is 'registered'. All you need to do now is register a few more. Simply copy the code snippet located in functions.php, and displayed below, and paste each snippet for as many sidebars that you want.
Locate the initial snippet in functions.php:
if ( function_exists('register_sidebar') ) {
register_sidebar(array('name'=>'sidebar1',
'before_widget' => '<li id="%1$s" class="widget %2$s">',
'after_widget' => '</li>', 'before_title' => '<h2 class="widgettitle">',
'after_title' => '</h2>', ));
Copy the code displayed below and paste it below the initial snippet as many times equal to the amount of new sidebars you want.
register_sidebar(array('name'=>'YourSidebarName',
'before_widget' => '<li id="%1$s" class="widget %2$s">',
'after_widget' => '</li>', 'before_title' => '<h2 class="widgettitle">',
'after_title' => '</h2>', ));
Make sure the bold code is present (if it's not, add it) and that you set the unique sidebar name for each code snippet you add. Note also that the code within the register_sidebar snippet may vary from theme to theme, and that the important thing is that you include the bold code.
Example of code:
if ( function_exists('register_sidebar') ) {
register_sidebar(array('name'=>'sidebar1',
'before_widget' => '<li id="%1$s" class="widget %2$s">',
'after_widget' => '</li>', 'before_title' => '<h2 class="widgettitle">',
'after_title' => '</h2>', ));
register_sidebar(array('name'=>'movies',
'before_widget' => '<li id="%1$s" class="widget %2$s">',
'after_widget' => '</li>', 'before_title' => '<h2 class="widgettitle">',
'after_title' => '</h2>', ));
register_sidebar(array('name'=>'wordpress',
'before_widget' => '<li id="%1$s" class="widget %2$s">',
'after_widget' => '</li>', 'before_title' => '<h2 class="widgettitle">',
'after_title' => '</h2>', ));
register_sidebar(array('name'=>'music',
'before_widget' => '<li id="%1$s" class="widget %2$s">',
'after_widget' => '</li>', 'before_title' => '<h2 class="widgettitle">',
'after_title' => '</h2>', ));
}
When you have added the registration code into functions.php, go to the admin>appearance>widgets, and your new sidebars should appear like below:
Step 2 - Creating sidebar files
Now, like the parent file sidebar.php, your newly registered sidebars also need to exist as files. Open the parent sidebar.php and copy the code over to a new html document. Save it where sidebar.php is located, as sidebar-YourSidebarName.php.
Add the code below, above <?php dynamic_sidebar(); ?> in sidebar-YourSidebarName.php and remember to match the sidebar name in the code (bold) with the file name.
<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('YourSidebarName') ) : ?> <?php endif; ?>
Note! Make sure to save the new sidebar as sidebar-YourSidebarName.php, with emphasis on "sidebar-". Once this is done, the new sidebar files will appear in admin>appearance>editor, like below:
Step 3 - Adding the Custom Fields function
Finally, you just need to implement the custom field function. Locate <?php get_sidebar(); ?> in single.php and replace it with the following code:
<?php $sidebar = get_post_meta($post->ID, "sidebar", true); get_sidebar($sidebar); ?>
This will allow you to decide upon a sidebar using Custom Fields for each individual post. This however does not mean that you have to make a unique sidebar every time you write a new post. Leave it, and the original sidebar will be used.
Add the new custom field 'sidebar' and in value type in the name of the sidebar you want (using tutorial examples: movies, wordpress or movies). Do not put the whole file name of your new sidebars, such as "sidebar-movies", as it will not work. Excluding "sidebar-" will suffice. You can now start to fill each sidebar with post-specific content, ads etc.
Feedback
If you find this tutorial too hard and/or impossible to complete with desired results, chances are it's you, me or your blog situation. In any case, please comment below or send me an email to brian [at] webhostingsearch [dot] com. Also you who has found this tutorial helpful are welcome to share your kind words :).
Comments
wordpress video tutorial
12:52, January 11, 2010
Great tutorial for wordpress users. Thanks.Really I hellp this post.
wordpress video tutorial
12:54, January 11, 2010
Great tutorial for wordpress users. Thanks.Really I hellp this post.
[url=http://www.wordpress-r-us.com/]wordpress tutorial[/url]
Olivia
11:10, January 19, 2010
What a lifesaver! Thank you for explaining everything in detail, I found another tutorial that gave me the same gist as this but left out too many details and I couldn't figure out why it wasn't working. I owe success to you, thanks for this!
brian franklin
03:46, February 22, 2010
glad it helped, it's mashup of two three separate tutorials :)