Memasang Footer Untuk Template Blogspot

Cara membuat footer tiga kolom pada template blogger dengan mudah. Ya memang mudah sekali, khususnya pada template thesis for blogspot, dengan sedikit penambahan pada template thesis ini, maka terciptalah 3 buah kolom pada bagian footer yang dapat diisi dengan berbagai macam widget :)

Untuk template thesis for blogspot, letakkan kode ini diatas <div id='credit' style='border-top:1px solid #ccc;'>

Screenshot 3 Column Footers On Yanfizs Template:

<style>
#footer-wrapper{background:#eee;border-top:3px double #ccc;padding:10px;clear:both;margin:0 auto;border-bottom:1px solid #efefef;box-shadow:0 1px 0 #eee,0 -1px 0 #ddd}
.footer-column li{color:#dedede;padding:10px;background:rgba(0,0,0,.9);border:1px solid #000;border-right:1px solid #353535;border-bottom:1px solid #353535}
.footer-column h2,.footer-column h4{color:#888;padding-left:10px;font-size:1.75em;}
.footer-column ul{list-style:none;margin:20px 0;padding:0}
.footer-column ul li{list-style-type:none;border-top:1px solid #222;border-bottom:1px solid #111;padding:10px}
.footer-column ul li:before{content:&quot;\274A&quot;;color:#f90;}
.footer-column ul li a{color:#fff;text-decoration:none;padding:0 auto;transition:1.5s linear;-moz-transition:all 1.5s;-webkit-transition:1.5s linear;}
.footer-column ul li a:hover{color:#00cfff}
.footer-column ul li:hover{background:#000;transition:1.5s linear;-moz-transition:all 1.5s;-webkit-transition:1.5s linear;}
.footer-column ul li:first-child{border-top:none}
.footer-column ul li:last-child{border-bottom:none}
#footer-bottom{width:100%;text-align:center;margin:0 auto}
#footer-bottom1{width:33%;float:left}
#footer-bottom2{width:33%;float:left;margin:0 0 0 5px}
#footer-bottom3{width:33%;float:right}
</style>
<div id='footer-wrapper'>
<div id='footer-bottom'>
<b:section class='footer' id='col-bottom' preferred='yes'/>
</div>
<div style='clear:both;'/>
<div id='footer-bottom1'>
<b:section class='footer-column' id='col1' preferred='yes'/>
</div>
<div id='footer-bottom2'>
<b:section class='footer-column' id='col2' preferred='yes'/>
</div>
<div id='footer-bottom3'>
<b:section class='footer-column' id='col3' preferred='yes'/>
</div>
<div style='clear:both;'/>
</div>