Monday 22 December 2014

Cara Membuat Header Menjadi Dua Kolom

iyan-blog.com | Cara Membuat Header Menjadi Dua Kolom - Pernah kah anda melihat blog dengan iklan disebelah headernya?, pasti pernah. kali ini saya akan membahas bagaimana cara membuat header menjadi dua kolom. kolom pertama fungsinya untuk nama dan deskripsi blog anda sendiri, dan kolom yang kedua fungsinya sebagai kolom untuk iklan. langsung saja ikuti tutorialnya:



1. Log in ke blogger
2. masuk ke halaman Template >> Edit HTML
3. Letakkan CSS dibawah ini diatas ]]></b:skin>
#header-wrapper{width:100%;overflow:hidden;}
4. Letakkan HTML dibawah ini dibawah <div id='wrapper'>
<header id="header-wrapper">
<b:section class="header" id="header-left" maxwidgets="1">
<b:section class="header" id="header-right" maxwidgets="1">
</b:section></b:section></header>

5. Lalu letakkan CSS dibawah ini diatas ]]></b:skin>
#header-left{width:262px;overflow:hidden;float:left;}
#header-right{width:738px;overflow:hidden;float:right;}
.header .widget{padding:5px;}

*Fungsi float diatas sebagai penempatan; *jika anda ingin merubah besar kecil ukurannya, silakan sesuaikan angka berwarna merah.
6. Simpan Template

 Sekian postingan kali ini, Semoga bermanfaat.

Load comments