Halaman

  • Beranda

Sabtu, 01 September 2012

Cara Membuat Widget Footer Pada Blogger

Salam blogger, pada kesempatan ini saya akan sedikit membahas mengenai penataan widget. Kebanyakan template di internet tidak menggunakan footer, tapi kali ini sobat gak usah pusing-pusing lagi memikirkan hal itu. Trik blogger yang satu ini layaknya mesin pencetak yang dapat membuat sesuatu yang tidak ada menjadi ada. Cara ini memang mudah untuk blogger yang berpengalaman, tapi buat blogger pemula atau newbie seperti saya rasanya sulit sekali untuk membuat hal tersebut tanpa panduan manual.

Untuk lebih jelas ikuti langkah-langkah dibawah ini:
1. Login ke account blogger sobat
2. klik menu Template
3. kemudian pilih Edit Html
4. pilih lanjutkan untuk masuk ke Setup Html
5. setelah masuk jangan lupa centang kotak kecil di pojok kiri yang 
    bertuliskan "expand template widget"
6. kemudian sobat cari kode ]]></b:skin>, agar pencarian lebih mudah 
    sobat tekan tombol ctrl+f pada keyboard komputer sobat
7. Copy kode dibawah ini dan paste diatas kode ]]></b:skin> 
#footer-column-divide {clear:both;}.footer-column {padding: 10px;}
8. lalu cari lagi kode <div id='footer-wrapper'> atau <div class='footer-outer'>
9. copy kode dibawah ini lalu letakan dibawah kode <div id='footer-wrapper'> 
    atau <div class='footer-outer'> tadi

-Script untuk menambah 2 kolom
<div id='footer-column-divide'><div id='footer1' style='width: 50%; float:left; margin:0; text-align:left;'><b:section class='footer-column' id='col1' preferred='yes' style='float:left;'/></div><div id='footer2' style='width: 50%; float: left; margin:0; text-align: left;'><b:section class='footer-column' id='col2' preferred='yes' style='float:left;'/></div><div style='clear:both;'/></div> 
 -Script untuk menambah 3 kolom
<div id='footer-column-divide'><div id='footer1' style='width: 33%; float:left; margin:0; text-align:left;'><b:section class='footer-column' id='col1' preferred='yes' style='float:left;'/></div><div id='footer2' style='width: 33%; float: left; margin:0; text-align: left;'><b:section class='footer-column' id='col2' preferred='yes' style='float:left;'/></div><div id='footer3' style='width: 33%; float: right; margin:0; text-align: left;'><b:section class='footer-column' id='col3' preferred='yes' style='float:right;'/></div><div style='clear:both;'/></div>
-Script untuk menambah 4 kolom
<div id='footer-column-divide'> <div id='footer1' style='width: 25%; float:left; margin:0; text-align:left;'><b:section class='footer-column' id='col1' preferred='yes' style='float:left;'/></div><div id='footer2' style='width: 25%; float: left; margin:0; text-align: left;'><b:section class='footer-column' id='col2' preferred='yes' style='float:left;'/></div><div id='footer3' style='width: 25%; float: right; margin:0; text-align: left;'><b:section class='footer-column' id='col3' preferred='yes' style='float:right;'/></div><div id='footer4' style='width: 25%; float: right; margin:0; text-align: left;'><b:section class='footer-column' id='col4' preferred='yes' style='float:right;'/></div><div style='clear:both;'/></div>
10. Selesai, sekarang anda tinggal memasukan gadgetnya

Selamat mencoba dan semoga bermanfaat 

0 komentar:

Posting Komentar