How To Add Two Columns below your blogger post

Posted by Lasantha Bandara on May 31st, 2009 File Under : change template, css, html6 Comments

1.Log in to your dashboard--> layout- -> Edit HTML

2.Scroll down to where you see like this code.

<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog type='Blog'/>

3.Now add below code between  </b:section>  and  </div> .

<b:section class='sidebar' id='magazine-left' showaddelement='yes'>
<b:widget id='Text51' locked='false' title='Column 1' type='Text'/>

<b:section class='sidebar' id='magazine-right' showaddelement='yes'>
<b:widget id='Text52' locked='false' title='Column 2' type='Text'/>

<div style="clear: both;"></div>

Look at the picture below.

Now it will look like this.


4.Now Find below code.


5.Add below code before  ]]></b:skin>  tag.

#magazine-left {
width: 45%;
float: left;
#magazine-right {
width: 45%;
float: right;

6.Now save your template and you are done.It look like this.

File Under : change template, css, html

6 Responses to “How To Add Two Columns below your blogger post”

  1. WBW says:

    dear friend...
    thx for all tutorial. good luck.

  2. Javier Ocampo says:

    Excuse me I don't have that first code, so how would I do this, I can't find the code...

  3. whispers says:

    Nice job,thanks for it

  4. rajasthan current affairs says:

    thanx for ur tutorial

  5. isaiah Joseph says:

    thanks admin for this wonderful tips, it is simply great

  6. shamith says:


Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.