Add Customized Three Column Footer In Blogger Blog

you must have seen the three column widget at the bottom of the blog. Its mostly used by professional Bloggers. Three column footer widget used to add whatever you like, well I have added recent posts , popular posts followers , DMCA privacy , bloggers and alexa rank toolbar. It will help you to keep your reader on your blog for maximum time. Three column footer is a customized widget so you can change its size , background color width and all the things. Just follow the simple steps to add the three column widget at the bottom of your blogger blog. 

see the bellow snapshot. 

Install 3 column widget at the bottom of your blog

1. Login into your blogger blog. 
2. Go to Templates 
3. Click on EDIT HTML 
4. Now search for ]]></b:skin> code 
5. Just above ]]></b:skin> code paste the following code

/* ----- customizedlower SECTION By http://theoriginalbloggertricks.blogspot.com/----- */
#customizedlower {
margin:auto;
padding: 0px 0px 10px 0px;
width: 100%;
background:#066d87;
}
#customizedlower-wrapper {
margin:auto;
padding: 20px 0px 20px 0px;
width: 900px;
}
#customizedlowerbar-wrapper {
border:1px solid #066d87;
background:#066d87;
float: left;
margin: 0px 5px auto;
padding-bottom: 20px;
width: 32%;
text-align: justify;
font-size:100%;
line-height: 1.6em;
word-wrap: break-word;
overflow: hidden;
}
.customizedlowerbar {margin: 0; padding: 0;}
.customizedlowerbar .widget {margin: 0; padding: 10px 20px 0px 20px;}
.customizedlowerbar h2 {
margin: 0px 0px 10px 0px;
padding: 3px 0px 3px 0px;
text-align: left;
color:#ff00f6;
text-transform:uppercase;
font: bold 14px Arial, Tahoma, Verdana;
border-bottom:3px solid #f6dc04;
}
.customizedlowerbar ul {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
list-style-type: none;
}
.customizedlowerbar li {
margin: 0px 0px 2px 0px;
padding: 0px 0px 1px 0px;
border-bottom: 1px dotted #ccc;
}

 6.Now just search </body> and add the following code above it

<div id='customizedlower'>
<div id='customizedlower-wrapper'>
<div id='customizedlowerbar-wrapper'>
<b:section class='customizedlowerbar' id='customizedlowerbar1' preferred='yes'>
</b:section>
</div>
<div id='customizedlowerbar-wrapper'>
<b:section class='customizedlowerbar' id='customizedlowerbar2' preferred='yes'>
</b:section>
</div>
<div id='customizedlowerbar-wrapper'>
<b:section class='customizedlowerbar' id='customizedlowerbar3' preferred='yes'>
</b:section>
</div>
<div style='clear: both;'/>
</div> </div>

 Now save your template and you have done !

7. Now go to layout and start adding widgets.

Customization

If you want to customize this widget for your blogger template then follow the simple steps
To change the Width of this blogger widget then simply change 900px
To change the background of this widget change background:#066d87 (use this tool)
To change the width of column then change 32% and you have done!