How-To: Adding Sidebar To Wordpress Theme

Published: Friday, 08 October 2010 Written by Abang Wan

Salam all,

These few days I been working with my online shop CMS, the site is http://ibzatech.com, huhuhu promo abit. It is a online bookshop. We have been selling on-line for quite some time now. Ibzatech.com has been around since 2007 if I'm not mistaken, and in that time also we have been changing CMS and recreate databases to fine the right 1 that meet our needs.

The latest edition of our website is using Wordpress. Weird right, hehe but as I come to see that Wordpress has evolve to be very versatile CMS. From what I could remember back in the days where I started to play with the webs, Wordpress was only a simple bloging CMS, it started to make its name cause the ease of installing the cms in the webserver and the user-friendliness of publishing entries. But now thanks to the large community of wordpress the developer manage to improve their CMS into a more versatile product, bravo bravo...

Enough of history, After managing the site for a few months, it seems that the site would be better if I could add another sidebar to the theme. The current theme only have 2 column, the sidebar and the main column for the content@entries. So being a person with no much experience with Wordpress before, I've only use Wordpress for a short while, never had a change to tweak it, in order to made this happens, I must learn how Wordpress works.... ZzzZzz.. It not that hard but the questions is time, time, time...

So google time, found a few good site that gimme a sketch how wordpress works and how to do it. So the conclusion:

In your theme folder "/wp-content/themes/yourcurrenttheme" edit function.php. Add this code:-

<?php
if ( function_exists('register_sidebars') )
register_sidebars(2);
?>

Make a new blank file called sidebar2.php. Put this code into sidebar2.php and save the file :-

<div>
<ul>
<?php if ( function_exists('dynamic_sidebar') && dynamic_sidebar(2) ) : else : ?>
<?php endif; ?>
</ul>
</div>

Just open index.php file from your theme folder and locate the code that calls your sidebar file (sidebar.php). It should look something like :-

<?php include (TEMPLATEPATH . '/sidebar.php'); ?> or <?php get_sidebar(); ?>

Once you find a suitable place, place the following code there :-

<?php include (TEMPLATEPATH . '/sidebar2.php'); ?>

Now the tricky part, by this time your theme will show you 2 sidebars, but most of the time it will not be exactly like you want it to be. So you need to adjust your theme CSS (style.css) to 'blend' your new sidebar perfectly. Happy trying...

Salam....

Hits: 2101

Add comment


Security code
Refresh