how to insert column in blogger template

how to insert column in blogger template

In this tutorial i am going to show you how to insert extra columns in blogger 
default layout, hope this will be very handy for you to personalize your blog. 
We can add different gadgets in blogger layout easily by using "Add a widget" 
feature

but it is hard to add an extra column. 
By this tutorial you will be able to convert
 your blogger layout to a magazine style layout, which is the 
most popular layout style 

now a days. I will show how to add two extra columns bellow blog post section, 

however if you will read and understand the tutorial properly and carry a little bit 
of knowledge 

of the codes, then you will be able to put it anywhere in the template layout. 

So read it properly and then use it in your own way.

Follow the following steps

1) Go to Template-----Edit HTML------Expand Widget Templates

2) Find out </b:section> tag associated with the Sidebar, as an example

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

3) After that add the following codes after </b:section> and before </div>

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:section class='sidebar' id='magazine-left' showaddelement='yes'/>
<b:section class='sidebar' id='magazine-right' showaddelement='yes'/>
<div style='clear: both;'/>
</b:if>

4) Now search for the code ]]></b:skin> by pressing Ctrl+F
5) Just before ]]></b:skin> paste the following codes

#magazine-left {
  width: 40%;
  float: left;
}
#magazine-right {
  width: 40%;
  float: right;
}

6) After that click on Preview if everything is going well, 
then click on Save template.
That's all. Subscribe Us.