How to have a third side bar in BlogSpot

This is something many bloggers always wanted .A third side bar so that you can have additional stuff in there.

So here I am going to explain in detail how to add a third side bar to the blog.The side bar will be added to the left. Note that this tutorial is on the assumption that you currently have a two side bar template with the side bar in the right.

Let us start by expanding the resolution of the outer wrapper so that you will be able to accommodate a third sidebar in your blog. Please back up your template in case of emergencies.

Login to your blogger account and go to the layout of the blog and then click Edit Html.

Scroll down until you find the following:

#outer-wrapper{

Width:900px;

………………

}

In the width field increase the pixels to 900 as shown above.

#main-wrapper {

width: 450px;

…………………….

}

Similarly set the width in the main wrapper to around 450 px.

#sidebar-wrapper {

width: 250px;

………………………….

}

Similarly, set the width in the sidebar wrapper to 250px.

Now we will have to add some new code in the template.

Scroll down until you find the following code.

<div id='content-wrapper'>

<div id='crosscol-wrapper' style='text-align:center' >

<b:section class='crosscol' id='crosscol' showaddelement='no'/ >

</div >

Then add the following code below it.

<div id='left-sidebar-wrapper'>

<b:section class='sidebar' id='left-sidebar' preferred='yes'/>

</div>

Now it is time to add the CSS

Just go to the following code:

#outer-wrapper{

Width:900px;

………………

}

Now paste the following code just below it:

#left-sidebar-wrapper {

background:$bgcolor;

width: 145px;

float: left;

word-wrap: break-word;

overflow: hidden;

}

Now save your template and now you can have a new side bar in the left.

Enjoy……………….