I have told you about creating three columns in Blogger template.
Many of us try to avoid this as it may sometimes look clumsy but we
need widget sections to add some blogger gadgets. Now if you want to add
two small sidebar columns below main sidebar in your blogger template,
then I will tell you how to do it.
So let's start!
First go to Design > Edit HTML and backup your template.
1. Find the below section:
#sidebar-wrapper {
width:220px;
float:right;
word-wrap:break-word;
overflow:hidden;
}
2. And just below it add the following codes:
#right-col {
width:48%;
float:right;
word-wrap:break-word;
overflow:hidden;
}
#left-col {
width:48%;
float:left;
word-wrap:break-word;
overflow:hidden;
}
3. Now find:
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'/>
</div>
4. And add the bold codes or replace the whole code with:
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'/>
<b:section class='sidebar' id='left-col' preferred='yes'/>
<b:section class='sidebar' id='right-col' preferred='yes'/>
</div>
These bold snippets are added which would actually add two widget sections
below the main sidebar. Preview your template for any errors and save it.
Update: Some of you are having trouble adding the two small
sidebar
columns in their templates and may be getting an XML error. So,
here's the solution:
You must be having widgets in your sidebar like:
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
< ..widgets here.. >
</b:section>
</div>
Put the bold codes below
</b:section> as shown below:
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
< ..widgets here.. >
</b:section>
<b:section class='sidebar' id='left-col' preferred='yes'/>
<b:section class='sidebar' id='right-col' preferred='yes'/>
</div>
Now go to
Design > Page Elements and check for your newly added two
small sidebars below you main sidebar.
