Membuat 3 Kolom Widget di Bawah Header

Membuat 3 Kolom Widget Di bawah Header - Hem, apa kabar kawan - kawan kali ini saya akan menulis tentang Membuat 3 Colom Widget Di bawah Header, Gak basa basi Lagi langsung saja kita membuat Membuat 3 Kolom Widget Di bawah Header :


Langkah - langkah Membuat 3 Kolom Widget Di bawah Header :

1.  Login ke blogger.
2.  Setelah masuk dasbor lalu pilih Tata Letak.
3.  setelah itu klik Edit HTML.
4.  Cari kode ]]></b:skin> 

5.  Copy kode di bawah ini dan simpan di atas kode ]]></b:skin>

    #Header-column-divide {
    clear:both;
    }
    .header-column {
    padding: 10px;
    }


    #header-column-divide {
    clear:both;
    }
    .header-column {
    padding: 10px;
    }


6.Selanjutnya Cari kode dibawah ini .

    <div id='header-wrapper'>
    <b:section class='footer' id='footer'/>
    </div>


7.Jikalau sudah ketemu Hapus kode <b:section class='footer' id='footer'/> kemudian ganti bengan kode dibawah ini .

    <div id='header-column-divide'>

    <div id='header1' style='width: 30%; float:left;
    margin:0; text-align:left;'>
    <b:section class='header-column' id='col1'
    preferred='yes' style='float:left;'/>
    </div>

    <div id='header2' style='width: 40%; float: left;
    margin:0; text-align: left;'>
    <b:section class='header-column' id='col2'
    preferred='yes' style='float:left;'/>
    </div>

    <div id='header3' style='width: 30%; float: right;
    margin:0; text-align: left;'>
    <b:section class='header-column' id='col3'
    preferred='yes' style='float:right;'/>
    </div>

    <div style='clear:both;'/>
    </div>


8. Save Template dan Lihat hasilnya


Nah sekian dulu Tutorial Membuat 3 Kolom Widget Di bawah Header Selamat mencoba (-_-)