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.
Example :
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.
If you enjoyed this post and wish to be informed whenever a new post is published, then make sure you subscribe to my regular Email Updates.
Subscribe Now!
0 comments: