Membuat Scroll Pada Kotak Komentar Blog

Pagi ini saya akan memberikan Sedikit Tutorial Cara Membuat Scroll Pada Kotak Komentar Blog. Sebelum memulai Tutorial kali ini, saya ucapkan banyak Terima Kasih kepada Kang ibnu_rahmadi (http://kakve-santi.blogspot.com/) yang sudah mau berkomentar dan Bertanya Bagaimana Cara Membuat Kotak Komentar Threaded dengan Scroll seperti di Blog ini. Nah karena itu saya jadi termotivasi Membuat Postingan ini. hehehe

Kotak komentar merupakan Kelengkapan Blog yang sangat Penting. Yang fungsinya adalah untuk saling tukar pendapat, saling review dan sarana untuk saling mengenal antara sesama blogger dll. Tanpa adanya Kotak Komentar dan Komentator, Suatu Blog akan terasa Sepi dan merupakan Blog yang hidupnya Sendirian.

Lain halnya dengan Blog yang ramai dengan Komentator,  sehingga kotak komentarnya akan dipenuhi dengan komentar-komentar dan membuat kotak komentar akan semakin memanjang ke bawah, jadi yang ingin memberi komentar baru, harus menggerakkan scroll terus hingga kebawah. Selain itu, tutorial ini juga berfungsi untuk optimasi loading blog yang lambat karena banyaknya komentar. Jika Sobat Belum Membuat Kotak Komentar Thread Silahkan Klik Disini. Jika Sudah Ok Langsung saja Ikuti Langkah" di Bawah ini :

Untuk Kotak Komentar Threaded :

1. Masuk Blogger.com
2. Pilih Template "Sebelumnya Backup dulu Template Blog Sobat".
3. Klik Edit HTML->>Jangan lupa Ceklis "Expand Widget Templates".
4. Untuk mempermudah pencarian Tekan Ctrl+F, dan Cari Kode .comments .comments-content .comment-thread ol { Atau kurang Lebih seperti dibawah ini.

.comments .comments-content .comment-thread ol {
  list-style-type: none;
  padding: 0;
  text-align: none;}

5. Jika sudah ketemu, Silahkan Sobat Copas Kode dibawah dan Pastekan Setelah(dibawah) Kode .comments .comments-content .comment-thread ol { Tadi.


max-height:350px;border:0px solid #eee;overflow:auto;


6. Sehingga akan Menjadi Seperti dibawah ini:


.comments .comments-content .comment-thread ol {
  max-height:350px;border:0px solid #eee;overflow:auto;
  list-style-type: none;
  padding: 0;
  text-align: none;}

7. Simpan/Save dan lihat Hasilnya.

Keterangan : Untuk Kode yang berwarna Merah adalah ukuran maksimal Scroll, Silahka Sobat rubah sesuai keinginan Sobat.


Untuk Kotak Komentar Biasa :

1. Masuk Blogger.com
2. Pilih Template "Sebelumnya Backup dulu Template Blog Sobat".
3. Klik Edit HTML->>Jangan lupa Ceklis "Expand Widget Templates".
4. Untuk mempermudah pencarian Tekan Ctrl+F, dan Cari Kode #comments-block {
5. Jika sudah Ketemu Seperti biasa silahkan Copas kode di bawah  ini dan Pastekan setelah(dibawah) kode #comments-block { yang tadi.

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

Keterangan : Untuk Kode yang berwarna Merah adalah ukuran maksimal Scroll, Silahka Sobat rubah sesuai keinginan Sobat. Dan apabila template Sobat ada kode border:0px dotted #ccc; silahkan hapus kode tersebut.

6. Simpan/Save dan lihat Hasilnya.

Bagaimana apakah Sobat Berhasil menerapkannya di Blog Sobat...??? Silahkan Tinggalkan Komentar, Kritik serta Saran Sobat di Kotak Komentar saya. Ok mungkin Hanya itu yang bisa saya Sampaikan kali ini, lebih dan kurangnya Mohon dimaafkan. Selamat Mencoba dan Semoga Bermanfaat. :)

Baca Juga yang ini Sob...: