Adding Footer 3 Column on Your Blogger Template

Editing a blogger to have a footer template 3 column blogger template for it was not a difficult case, but is very easy, only takes a few minutes of your time. Perhaps the fellow bloggers think of this complicated job, well please just assume so, but wait a minute reading this tutorial, you will definitely be surprised.

Previously I announced that this tutorial special for blogger beta (layout), okay with it.

    1. As always log into blogger.com
    2. Then click "Expand Widget Templates"
    3. Then save your template in case something goes wrong
    4. Then find this:

 <div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

5. Replace the red tag with the following script:

<div id='footer-column-container'>
<div id='footer2' style='width: 30%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col1' preferred='yes' style='float:left;'/>
</div>

<div id='footer3' style='width: 40%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col2' preferred='yes' style='float:left;'/>
</div>

<div id='footer4' style='width: 30%; float: right; margin:0; text-align: left;'>
<b:section class='footer-column' id='col3' preferred='yes' style='float:right;'/>
</div>

<div style='clear:both;'/>
<p>
<hr align='center' color='#5d5d54' width='90%'/></p>
<div id='footer-bottom' style='text-align: center; padding: 10px; text-transform: lowercase;'>
<b:section class='footer' id='col-bottom' preferred='yes'>
<b:widget id='Text2' locked='false' title='' type='Text'/>
</b:section>
</div>

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

6. Save your template!

Congratulations you already have a 3 column footer in your blogger. To see the results, you go back to the "page element" and then look at the footer, there's 3 places to put the page element. Now please put the page element you want in the footer of your 3-column blogger blogspot.

May be useful and good luck.



source : http://abibakarblog.com/tutorial-blogger/menambahkan-footer-3-kolom-di-template-blogger-anda/