Posted by Syed Muhammad Ali
 |
Footer Column plays role in helping visitor to understand your blog. You can place your pages and other link in footer and visitor can easily see your footer. I saw a footer from a blog and i have customized it. You can easily add it to blogger. Just follow the below steps 
- Find ]]> by pressing Ctrl+F key
- Paste the Below code Just Above it
#footer-wrapper {clear: both;width: 100%; height:4px; background: Purple;}
You can change the border color by replacing Purple with your own colour
- Now Search For tag
- Just above it paste the below code
- Find ]]> in template by pressing Ctrl+F
- Paste the Below Code Above it
/*—– Infotechblogging three Column Widget (Green Border) STARTS—–*/#lower { margin:auto; padding: 0px 0px 10px 0px; width: 100%; background: url(https://lh5.googleusercontent.com/-ESCWPWeXzRM/UEAmpR0z8XI/AAAAAAAADbw/P_E_ZAwoZKA/s100/bg.png) repeat scroll 0 0 #222222; } #lower-wrapper { background: url(https://lh5.googleusercontent.com/-ESCWPWeXzRM/UEAmpR0z8XI/AAAAAAAADbw/P_E_ZAwoZKA/s100/bg.png) repeat scroll 0 0 #222222; margin:auto; padding: 20px 0px 20px 0px; width: 960px;border:0; } #lowerbar-wrapper { background: url(https://lh5.googleusercontent.com/-ESCWPWeXzRM/UEAmpR0z8XI/AAAAAAAADbw/P_E_ZAwoZKA/s100/bg.png) repeat scroll 0 0 #222222; float: left; margin: 0px 5px auto; padding-bottom: 20px; width: 30%;text-align: justify; color:#ddd; font: bold 12px Arial, Tahoma, Verdana; line-height: 1.6em; word-wrap: break-word; overflow: hidden; } .lowerbar {margin: 0; padding: 0;} .lowerbar .widget {margin: 0; padding: 10px 20px 0px 20px;} .lowerbar h2 { margin: 0px 0px 10px 0px; padding: 3px 0px 3px 0px; text-align: left; border:0; color:Purple; text-transform:uppercase; font: bold 14px Arial, Tahoma, Verdana; } .lowerbar ul { color:#fff; margin: 0 auto; padding: 0; list-style-type: none; } .lowerbar li { display:block; color:#fff; line-height: 1.6em; margin-left: 0 !important; padding: 6px; border-bottom: 1px solid #222; border-top: 1px solid #444; list-style-type: none; } .lowerbar li a { text-decoration:none; color: #DBDBDB; } .lowerbar li a:hover { text-decoration:underline; } .lowerbar li:hover { display:block; background: #222; }
/*—– Infotechblogging three Column Widget (Green Border) END—–*/
- Change 960px to Your Required Width or Replace it with 100% to get Sheet Length Footer
- Now Search For tag
- Paste the below code just above tag
Save your Template and you are done!
I hope you like this widget, Ask any queries in below comments
Follow Us! 
About This Blog:
InfoTechBlogging is owned by Syed Muhammad.Ali who loves to help other bloggers in starting their Blogging career. He also share Blogger Widgets and Templates.
Follow Him at : Google |Facebook| Twitter
