MEMBUAT FOOTER 3 KOLOM

Footer adalah bagian bawah Template, biasanya terdiri dari 1, 2, 3, atau 4 kolom. Footer yang sesuai tentunya dapat mempercantik tampilan Blog.
Bila kita menggunakan template bawaan dari Blogger, tentunya tidak akan mengalami kesulitan mengatur footer. Karena Blogger telah menyediakan pirantinya, yaitu Perancang Template, nah masalahnya bila kita menggunakan template dari penyedia template lain. Berikut ini cara-caranya :     

• Login Blogger, pada dashbord klik Rancangan lalu klik edit HTML. Untuk keamanan terlebih dahulu downloadlah template lengkap.

 ini kode CSSnya :

#footer-column-container {</div><div style="color: black;">clear:both;</div><div style="color: black;">}</div><div style="color: black;">.footer-column {</div><div style="color: black;">padding: 10px;</div><div style="color: black;">}

• Copy dan pastekan sebelum kode </b:skin>
• Lalu cari kode <b:section class='footer' id='footer'/> (pakai CTRL+F)
• Copy dan paste kode dibawah ini, di bawah kode tersebut:

<div id='footer-column-container'></div><div style="color: black;"><div id='footer2' style='width: 30%; float: left;</div><div style="color: black;">margin:0; text-align: left;'></div><div style="color: black;"><b:section class='footer-column' id='col1'</div><div style="color: black;">preferred='yes' style='float:left;'/></div><div style="color: black;">        </div></div><div style="color: black;"><div id='footer3' style='width: 40%; float: left;</div><div style="color: black;">margin:0; text-align: left;'></div><div style="color: black;"><b:section class='footer-column' id='col2'</div><div style="color: black;">preferred='yes' style='float:left;'/></div><div style="color: black;">        </div></div><div style="color: black;"><div id='footer4' style='width: 30%; float: right;</div><div style="color: black;">margin:0; text-align: left;'></div><div style="color: black;"><b:section class='footer-column' id='col3'</div><div style="color: black;">preferred='yes' style='float:right;'/></div><div style="color: black;">        </div></div><div style="color: black;"><div style='clear:both;'/></div><div style="color: black;"><p></div><div style="color: black;"><hr align='center' color='#5d5d54' width='90%'/></p></div><div style="color: black;"><div id='footer-bottom' style='text-align: center; padding:</div><div style="color: black;">10px; text-transform: lowercase;'></div><div style="color: black;"><b:section class='footer' id='col-bottom' preferred='yes'></div><div style="color: black;"><b:widget id='Text2' locked='false' title='' type='Text'/></div><div style="color: black;"></b:section></div><div style="color: black;"></div></div><div style="color: black;"><div style='clear:both;'/></div><div style="color: black;"></div>

• Simpan template. 

Posted in: tutorial blogger