cara membuat widgets 3 kolom di bawah header blog

Ok langsung aja menuju lokasi TKP pengeditan template-nya.

• Silahkan login ke blogger.
• Tuju Tata Letak.
• Pilih tab Edit HML.
• klik Expand Template Widget
• Letakkan kode css berikut ini diatas kode ]]> </b:skin> 

 
======
#top {

background:#fff;

margin-top:10px auto;

width:960px;

overflow:hidden;

font-size:12px;

padding:10px;

}



#top h2 {

background:#000 url(http://lh5.ggpht.com/_7Y9pl24WpQY/Ss37F0ZA9kI/AAAAAAAAB2k/c_ySi8QZg20/header_thumb%5B2%5D.jpg) repeat-x;

font-size:14pt;

font-weight:400;

text-align:center;

font-style:normal;

line-height:1.3em;

color:#fff;

padding:5px;

margin-top:-10px;

margin-left:-10px;

margin-right:-10px;

}


#top ul {

color:#333;

margin:0;

padding:0;

}


#top ul li {

background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzXiDlUbnjbgZQf277DrsK3zyfJzfG5H8xLrDD7eQm2_P1O8rawyO6M1sQTpv0fHC-OPk3s2fsEX-p1p07NYoC7bb_xyV7bXxITitqj8WK445BEMculrhGOecIAm7gpw4I_z5xlRjVmhyphenhyphenA/s320/b3.gif) no-repeat;

list-style-type:none;

border-bottom:1px dashed #CCC;

margin:0 0 10px;

padding:0 0 5px 20px;

}



#top ul li a:hover {

margin:0px 0px 5px;

padding:0px;

}


#topcenter {

width:300px;

float:left;

margin-left:10px;

background:#fff;

padding:10px

}


#topleft {

width:280px;

float:left;

margin-left:10px;

background:#fff;

padding:10px;

}


#topright {

width:280px;

float:right;

margin-left:10px;

background:#fff;

padding:10px;

}
======
Langkah ke dua
• Cari kode yang mirip seperti ini, biasanya letaknya dibawah </head>
=======
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='JUDUL BLOG SOBAT (Header)' type='Header'/>
</b:section>

</div>
 =======


Kemudian letakkan kode berikut di bawah ini tepat setelah kode diatas 

===============================================================
<div id='top'>
<b:section class='top' id='topleft' preferred='yes' showaddelement='yes'>
</b:section>

<b:section class='topcenter' id='topcenter' preferred='yes' showaddelement='yes'>
</b:section>

<b:section class='topright' id='topright' preferred='yes' showaddelement='yes'>
</b:section>
</div>
===============================================================


simpan template anda semoga berguna dan bermanfaat.