Filled Under:
Tips Trik Blogger
Cara Membuat sidebar dalam kotak yang terpisah
Oke langsung saja ke cara pembuatannya.
- Login ke blogger dengan id anda
- Silahkan klik rancangan
- Pada tab menu pilih Edit HTML
- Klik kotak kecil Expand Template Widget
- Untuk backup, silahkan klik teks Download Template Lengkap
- Cari kode ini :.sidebar .widget, .main .widget {
border-bottom:1px dotted $bordercolor;
margin:0 0 1.5em;
padding:0 0 1.5em;
} - Hapus kode di atas dan ganti dengan kode ini :.sidebar .widget {
background:#fff url(http://i38.tinypic.com/2lt5wsl.jpg) repeat-x top;
border:1px solid #0B610B;
margin:0 0 0.5em;
padding:0.5em;
font-family:"Trebuchet MS";
} - Berikutnya klik tombol Simpan Template
- Selesai
Oke, mudah-mudahan tidak ada kesulitan yang ditemui. Seperti yang saya katakan di atas, semua kode tersebut masih dapat anda utak-atik. Selamat mencoba dan semoga berhasil.
contoh-contoh sidebar dalam kotak komentar salah satunya seperti gambar dibawah ini:
Sidebar tanpa border pembatas
![sidebar dengan kotak pembatas](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijoikSjWSwG8bVlB5j3NrqfteDnHwB29TEoGhZb8nx2iJSL-XgLsnBTNgAO857LuBPQaX1a7EzZH8MHKRJyG7Io8zbKX3xYUybzntLrGjIFVvEa-T7Fuj6OY05upLSMa3ylbC_7RLCtMg/s400/sidebar-noborder.jpg)
Sidebar dengan border pembatas dan header background
![sidebar dengan pembatas dan background](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRzxOuB9q6Jq_dFLAKIwG-f84NzRUVVM6R1cbbEMg2ShORDRaRL8vD6odY3yJ8XW9ldYBGtHqylLw4xbETsZIZl_T2m3VVNdnPZC-sd9yDspO8RPPXkaHvEye5B5yCfdnXEzl6Rh8ZJTA/s400/sidebar-border-header-background.jpg)
Posting bagus dan bermanfaat. Terima kasih sharingnya gan...
BalasHapus