Cara Buat 3 kotak di Bawah Header

Cara Buat 3 kotak di Bawah Header -

Sebelumnya saya pernah posting tentang "Cara Buat 3 kotak di atas footer" 
tapi kali ini saya akan posting mengenai "Cara menembahkan 3 kotak di bawah header"


Berikut adalah cara-cara buat 3 kotak di bawah header:

• Pertama masuk dulu ke akun Blogger
• Lalu klik Rancangan lalu EDIT HTML
• Sebelum mengedit html nya cetang dulu EXPAND TEMPLATE WIDGET atau kalau mau lebih amannya Download template Lengkap untuk membuat salinan tamplate kalian. Hal ini gunanya jika kalian salah dalam mengedit html, kita dapat mudah mengembalikan template seperti semula.
• Lalu setelah itu cari kode   ]]></b:skin>. Untuk mempermudah pencarian, maka tekan CTRL+F
• Lalu setelah itu copy kode di bawah ini dan paste di atas kode   ]]></b:skin>

#box-main-container {

clear:both;

} 

.box-column {

padding:0px 10px 10px 10px;

border:1px dotted $bordercolor;

}

• lalu cari kode  <div id='main-wrapper'> 
• copy kode di bawah ini dan dan paste salah satu di atas kode  <div id='main-wrapper'> 

<div id='box-main-container'>

<div id='box1' style='width: 30%; float: left; margin:0; text-align: left;'>

<b:section class='box-column' id='col1' preferred='yes' style='float:left;'/>

</div>

<div id='box2' style='width: 40%; float: left; margin:0; text-align: left;'>

<b:section class='box-column' id='col2' preferred='yes' style='float:left;'/>

</div>

<div id='box3' style='width: 30%; float: right; margin:0; text-align: left;'>

<b:section class='box-column' id='col3' preferred='yes' style='float:right;'/>

</div>

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

</div>

Setelah itu klik SIMPAN

semoga artikel yang saya buat ini bermanfaat untuk kalian.....

Tweet