Cara Membuat Dan Menambahkan Kolom Sidebar Di Bawah Judul Blog

Cara Membuat Mengganti Memasang Mempercantik Pada Di Blog Blogger Blogspot Tutorial Trik Tips SEO Template Terbaru.
Membuat kolom sidebar dibawah header atau judul blog maksudnya adalah memberikan tambahan kolom yang sebelumnya tempalte default blog tidak menyediakan kolom dibawah title blog. fungsi dari kolom dibawah header atau title blog bisa digunakan untuk menambah widget, memasang iklan, meletakkan gambar dan lainnya didalamnya. Bagi yang ingin Membuat kolom sidebar dibawah title blog silahkan ikuti tutorial berikut:



1. Loggin - Rancangan - Edit HTML

2. Centang Expand Template Widget

3. Cari kode ]]></b:skin> (Gunakan f3)

4. Copy dan Paste Kode dibawah ini diatas kode ]]></b:skin>

/* KolomAtas
—————————- */
#kolomatas {
width: 500px;
position: relative;
clear:both;
margin: 0 auto;
color:#fff;
float: left;
background:none;
padding: 15px 0 15px 0;
}
#kolomatas h2 {
padding: 5px 0 2px 0;
margin: 0 0 10px 0;
color:#ff5a00;
font-size: 12px;
letter-spacing: -1px;
border-bottom: 1px solid #fff;
}
#kolomatas ul {
padding: 0;
margin: 0;
}
#kolomatas ul li {
line-height: 26px;
list-style-type: none;
border-bottom: 1px dotted #fff;
/* border-bottom: 1px dashed #031c5d; */
}
#kolomatas ul li a {
display: block;
padding: 0 10px;
color:#FFFF33;
text-decoration: none;
}
#kolomatas ul li a:hover {
background: #B1ACB1;
}
#left-kolomatas { /* yang ini nih kode kolom kiri */
width: 240px;
float: left;
padding-left:15px;
}
#right-kolomatas { /* kalo yg ini kode kolom kanan */
width: 240px;
float: left;
padding: 0 5px 0 15px;
}

5. selanjutnya cari kode atau yang mirip dibawah ini

<div id='outer-wrapper'>
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1'>
<b:widget id='Header1' locked='true' title='NAMA BLOG ANDA' type='Header'/>
</b:section>
</div>

6. Copy Paste script berikut tepat di bawah kode di atas

<div id='kolomatas'>
<b:section class='kolomatas' id='left-kolomatas'/>
<b:section class='kolomatas' id='right-kolomatas'/>
</div>

7. Simpan Template - Selesai

3 komentar

kalo kolom bawah gan ???
tolong chek blog saya sisatruk blogspot
balasnya via fb saya ya facebook.com/satruk
thanks

Reply

wah keren, masih gan tips nya...

Reply

Satria: Kolom bawah yang dimaksud kolom di bawaha header ato kolom footer...

Masedi: sm2...

Reply

Posting Komentar