Split two columns sidebar below blogger sidebar

Split your sidebar to two columns as in the below image so you can add page elements as two different widgets as two small sidebars.
First is to backup your template. Now go to Layout>Edit HTML and backup your template.

Find the below section in red


#sidebar-wrapper {

width:220px;

float:right;

word-wrap:break-word;

overflow:hidden;

}

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;

}


Now find the below codes in red

<div id='sidebar-wrapper'>

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

</div>


And replace the code with below codes

<div id='sidebar-wrapper'>

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

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

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

</div>


Preview your template and save it.
Now go to Layout>Page Elements and check for your newly added two columns below you sidebar. That’s it.

4 comments :

Anonymous said...

Good Post, Keep it up. Cheers.

burnertale said...

thanks really helpfull

Kiranmai .lanka said...

suprbbb thanks alot

http://www.btechboss.com/

Lijo Kv said...

Hi Admin, very very good. I really feel happy to see my website (http://www.gotechmax.com/)readers success in any task. That is the real spirit pal. Keep it up.

Post a Comment