Cara Membuat Scroll Untuk Kotak Komentar

Cara Membuat Scroll Untuk Kotak Komentar - Scroll memiliki banyak fungsi dan yang paling utama adalah bisa menghemat panjang suatu elemen. Terkadang ketika kita menulis di blog dan banyak yang berkomentar di tulisan atau postingan kita maka panjang blog akan ikut menyesuaikan dengan banyaknya komentar yang ada.

Bagi beberapa sobat blogger mungkin hal itu sedikit menganggu pemandangan blog so di sini lah peran

scroll pada kotak komentar

. Dengan

membuat scroll untuk kotak komentar

bisa mengehamat ruang di blog sobat, akan tetapi perlu di perhatikan karena dengan scroll juga bisa membuat pengunjung malas untuk membaca komentar2 yang sudah ada sebelumnya, jadi ya terserah sobat.

Jika sobat tertarik ingin membuat scroll di kotak komentar sobat bisa membaca kelanjutan posting ini, langsung saja tanpa basa-basi hehehe...

Cara membuat scroll kotak komentar

1. Login dulu di blogger sebelum membuat scroll kotak komentar.
2. Pilih tab Rancangan (Design) > Edit HTML.
3. Jika sudah cari kode berikut #comments-block{
4. Langkah selanjutnya adalah menambahkan kode css supaya kotak komentar tersebut mempunyai fungsi scroll, tambahkan kode berikut
   

   max-height:300px;border:1px solid #eee;overflow:auto;

   Sehingga akan menjadi seperti ini

   #comments-block{max-height:300px;border:1px solid #eee;overflow:auto;

5. Save dan lihat, kotak komentar blog sobat sudah ditampilkan dengan fungsi scroll.

Nah supaya tidak bingung, saya akan menjelaskan kode scroll untuk kotak komentar diatas. max-height:300px menunjukkan maksimal ketinggian kotak komentar, jika kurang dari 300px maka scroll masih tidak difungsikan. border:1px solid #eee adalah perintah untuk menyatakan bahwa scroll kotak komentar tersebut mempunyai ketebalan garis sebesar 1px dan solid serta kode warna border tersebut. overflow:auto kalau yang ini adalah inti dari membuat scroll kotak komentar ini. So kalau melebihi dari batas yang disesuaikan maka fungsi scroll akan diaktifkan.

Cara membuat scroll kotak komentar untuk threaded comments

Ternyata masih banyak sobat yang bingung dan belum bisa menggunakan fitur scroll ini pada kotak komentar. Setelah saya lihat, ternyata komentar yg digunakan berbeda, yaitu komentar yang langsung download dari blogger itu sendiri.

Hal ini dikarenakan template yang digunakan memang mengaktifkan atau menggunakan komentar yang model threded comments, makanya jadi agak ribet gitu. Tapi tenang ajah, saya udah coba eksperimen dan berhasil, jika sobat tertarik bisa mencobanya.

Intinya masih sama seperti yang diatas, cuman kita tidak menambahkan di css-nya, tapi langsung di kodenya. Cari kode

<div class='comments' id='comments'>

gunakakan Ctrl + F supaya lebih cepat, sobat akan menjumpai 2 kode, yang satu untuk template dekstop, yang satunya untuk template mobile (silahkan sobat coba2 sendiri ya). Jika sudah tambahkan kode berikut style='max-height:300px;overflow:auto;' sehingga lengkapnya akan menjadi seperti ini

<div class='comments' id='comments' style='max-height:300px;overflow:auto;'>

Sama toh inti nya dengan membuat scroll kotak komentar yang sebelumnya? Karena memang intinya hanya di overflow:auto itu sob.

Oke deh, selamat mencoba untuk membuat scroll kotak komentar ini. Semoga bermanfaat.

Title : Cara Membuat Scroll Untuk Kotak Komentar
URL : http://blogedek.blogspot.com/2012/03/membuat-scroll-untuk-kotak-komentar.html
Jangan lupa untuk membagikan artikel Cara Membuat Scroll Untuk Kotak Komentar ini jika bermanfaat bagi sobat.