Saturday, September 3, 2011

Cara Menambahkan Scroll pada Kotak Komentar dengan Menggunakan CSS


Cara Membuat Scroll pada Kotak Komentar dengan Menggunakan CSS  - Hayoo..siapa yang mau membuatscroll pada kotak komentar blognya dengan menggunakan CSS silahkan mampir disini…(hehe kayak orang mau jualan aja..!). Soalnya saya juga lagi bingung mau mulaidengan kalimat apa diawal tulisan, yang jelas topik kali ini memang maumembahas tuntas..tas..tentang cara membuat/menambahkan scroll pada kotak komentardengan menggunakan CSS. Jika jumlah komentar pada sebuah artikel di blog sobatsudah banyak mungkin 20-50 komentar, tentunya pengunjung lain yang inginberkomentar sedikit kerepotan karena harus scroll sampai bawah untuk menemukankotak komentarnya. Nah solusi jitu untuk hal yang seperti ini, sobat bisamembuatkan scroll langsung pada kotak komentar agar lebih memudahkan pengunjungsekaligus membuat tampilan blog jadi lebih simple.


Berikut ini langkah-langkah cara menambahkan/membuatscroll pada kotak komentar :
1.   Login ke dashboard blogger anda.
2.   Pilih Rancangan > Edit HTML, centang Expandwidget template.
3.   Carilah kode CSS kotak komentar dengan bantuanCtrl+F, biasanya ditandai dengan kode #comments-block{.
4.   Tambahkan kode CSS dibawah ini setelah kode  tadi.
max-height:300px;border:1px solid #eee;overflow:auto;
5.   Biar lebih jelas lagi saya berikan ilustrasi kodeCSS pada kotak komentar blog ini SEBELUMdan SESUDAH dilakukan perubahan.
Kode CSS kotak komentar SEBELUM dirubah :
#comments-block{border:0pxdotted #ccc;width:507px;margin:1.3em 0 1.5em;line-height:1.6em}
Kode CSS kotak komentar SESUDAH dirubah :
#comments-block{max-height:300px;border:1px solid #eee;overflow:auto;width:507px;margin:1.3em 0 1.5em;line-height:1.6em}
6.   Ukuran tinggi kotak komentar 300px, jenis border 1pxsolid serta warna border #eee dapatdirubah sesuai selera anda.
7.   Jika sudah selesai, SAVE template anda.

Well..sekarang tampilan kotak komentar jadi lebihrapi bukan ? Kalo gitu segera saja sobat membuat scroll pada kotak komentar blog andadengan sedikit menambahkan kode CSS saja, sehingga tampilan blognya juga jadilebih simple dan rapi serta nyaman dipandang. Semoga tips blogging ini bermanfaat.


No comments:

Post a Comment