6.Cara Membuat 3 Kolom Dibawah Header,

Tips dan Trik Blogger

1.Cara Membuat Artikel Terkait, 2.Cara Membuat Text Area, 3.Cara Membuat Text Melayang, 4.Cara Membuat Link Download, 5.Cara Membuat Menu Dropdown, 6.Cara Membuat 3 Kolom Dibawah Header, 7.Cara Membuat 3 Kolom diatas Footer, 8.Cara Menghilangkan Navbar di Blogger,

9.Cara Membuat Background Posting, 10.Cara Membuat Background Gambar, 11.Cara Membuat Backlink di Web dan Blog, 12.Cara Membuat Status YM Online di Web dan Blog, 13.Cara Membuat Widget SMS, 14.Cara Mengganti Icon Blogger, 15.Cara Membagi Menu Artikel Menjadi 2 Kolom 16.Membuat Typing Text

http://www.shareapic.net/content.php?gid=936463&owner=andy475

Triks Blogger G.Triks Blogger 1.Membuat Artikel Terkait 2.Membuat Text Area 3.Membuat text melayang 4.Membuat Link Download 5.Membuat Menu DropDown 6.Membuat 3 Kolom Dibawah Header 7.Membuat 3 Kolom Diatas Footer 8.Menghilangkan Navbar 9.Membuat Background Posting 10.Membuat Background Gambar 11.Membuat Link Backlink 12.Membuat Status YM Online 13.Pasang Widget SMS 14.Mengganti Icon Blogger 15.Membuat Menu Artikel Menjadi 2 Bagian

Cara Membuat 3 Kolom Dibawah Header,
Widget 3 kolom dibawah header ini sebenarnya bisa sobat tambahkan jika pada bagian sidebar template sudah penuh dan terlalu panjang. Sebagai alternatif untuk meletakkan kode html ataupun javascript yang mungkin sobat perlukan. Kurang lebih sama dengan postingan saya yang dulu tentang membuat multi kolom yang diletakkan di bagian bawah blog, namun kali ini saya meletakkannya bagian atas atau tepatnya dibawah header. Widget 3 kolom ini bisa sobat lihat demonya disini.

Baiklah langsung menuju lokasi pengeditan template-nya.
•     Silahkan login ke blogger.
•    Tuju Tata Letak.
•    Pilih tab Edit HML.
•    Jangan di klik Expand Template Widget, karena akan memusingkan sobat.
•    Letakkan kode css berikut ini diatas kode ]]></b:skin>

/* –- Top --*/
#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/AVvXsEix_FGrbBiXDSG0Rt5eVU175bLo0wa1Nj4MyRFq-w-Q-x3m3uEDkmoEihCAP4VFSPG24Ae3Vn0-Knut51eWR7DxWObivK2ZWoRl5AkbUCWCnBYs-nb_TItn9XoODAMkzVjmm07iw7WBCeKU/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;
}


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 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.

Semoga bermanfaat dan bisa membuat blog sobat jadi ramai.