Kotak Sidebar Terpisah

Sebenarnya saya sudah pernah membahas tentang Kotak Postingan Terpisah yang pada dasarnya agak - agak mirip dengan cara membuat sidebar terpisah - pisah ini. Tadi barusan juga ada pertanyaan dari sobat dalam kotak shoutmix dengan pertanyaan yang hampir sama, yaitu bagaimana cara membuat sidebar terpisah. Karena setiap template mempunyai karakter yang berbeda - beda, makanya saya tulis postingan ini untuk template yang umum digunakan atau template dasar.

Buka blogger dengan ID sobat.
Klik Tata Letak --> Edit HTML.
Contreng Expand Template Widget.
Lalu cari kode yang seperti ini :

.sidebar .widget, .main .widget {
margin:0 0 1.5em;
padding:0 0 1.5em;
}
Pisahkan saja sehingga menjadi seperti ini :

.sidebar .widget {
margin:0 0 1.5em;
padding:0 0 1.5em;
}

.main .widget {
margin:0 0 1.5em;
padding:0 0 1.5em;
}
Untuk sidebar terpisah sobat rubah menjadi seperti berikut :

.sidebar .widget {
background:#FFFFFF;
border:1px solid #CCCCCC;
margin:0 0 1.5em;
padding:0.5em;
}

Buat bagian main. widget atau kolom postingan tinggal sobat kreasikan sendiri, untuk background #FFFFFF adalah warna background putih dan border:1px solid #CCCCCC untuk border warna abu - abu. Kode warna bisa sobat lihat disini. Sedangkan untuk padding adalah jarak antara postingan dengan border, bisa juga sobat merubahnya menjadi padding:15px; agar lebih terlihat rapi antara postingan dengan border tidak terlalu rapat. Untuk kotak sidebar agar membentuk garis melengkung pada sudutnya sobat bisa tambahkan kode sehingga menjadi seperti berikut ini :

.sidebar .widget {
background:#FFFFFF;
border:1px solid #CCCCCC;
margin:0 0 1.5em;
padding:15px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
}

Sipp, buat sobat sebelum mengedit template nya sebaiknya cuci tangan dulu ya biar mousenya ga kotor..