tIPS Add 3 Coloumn Footer in Your Blog

how about make some Blogger hack in our template? Like adding 3 coloumn in footer?i see, you all agree about it. let’s begin.
  • Log in your blogger account
  • Move to Layout and Choose Edit HTML
  • Back up your blog first, and click on expand widget template
  • Copy this code and paste before the tag </b:skin>

#footer-column-container {
clear:both;


}


.footer-column {


padding: 10px;


}
  • save the template
  • Now, find this code
<div id='footer-wrapper'>


<b:section class='footer' id='footer'/>


</div>


  • Change the red code with code below
<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>

  • Save and done
Now you can check your Layout, if you follow the instruction you will see three footer have added.Good Luck.

Related Post



Related Posts with Thumbnails

Support

Software Blogs - BlogCatalog Blog Directory Online Marketing - OnToplist.com blog search directory blog directory blogarama - the blog directory Blog Directory & Search engine Computers Blogs My Zimbio