How To Add 3 Column Footer In Blogger

Before anything else, download and save a copy of your current template in case you decide to revert back to your current one..

First we must remove all the widgets/contents of your footer. Or if you want to keep them put it temporarily on your side bar like I did..

Go to customize/ edit HTML then scroll down until you see these line:



Then replace the second line with the code below (hold right click on the top of blank area and drag down to reveal and select the code) I can't find a way to make the text codes show, maybe i'll try to find out how to show html text on posts and blog it next..

<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>

Click Save and your done!

#update just found out an easy way to display HTML text in blog posts.. the code above is already showing..