Membuat Scroll Pada Komentar

Text Resizer: Click for Resizer

Setelah sebelumnya aku telah membuat tutorial Show Hiden Comment Blog,Terdapat pertannyaan dari teman saya mengenai bagaimana cara memberikan scrool pada kolom komentar.Tapi rasanya kurang nyaman juga ya melihat sebuah halaman dibuka dan daftar komentarnya panjang sekali, beberapa kali blogwalking dan melihat disebagian blog sahabat lainnya ada yang daftar komentarnya memakai scroll,Jadi kepengen nih buat,Tapi ntar aja buat kalo komentar untuk blogku udah banyak hehehe.Langsung aja ke tutorialnya yach....

Pertama-tama log in dulu ke account blog anda.

Pilih rancangan kemudian Edit HTML Jangan lupa Centang Expand Template Widget

Setelah itu back up dulu template anda supaya aman

Cari kode berikut ini : <dl id='comments-block'> Kalau tidak ada cari kode berikut ini <b:loop values='data:post.comments' var='comment'> pasti diatasnya ada kode yang pertama

Untuk memudahkan pencarian klik Ctrl + F atau F3 setelah itu tampilah menu seperti gambar berikut untuk mozila firefox

Setelah ketemu lalu sisipkan kode berikut di atas kode tadi: Nich kodenya <div style='overflow:auto; width:ancho; height:400px;'>

Tarik scroll kebawah sampai anda temukan kode </dl> atau gunakan lagi tombol Ctrl+f untuk mencari.

Setelah dapat letakkan kode berikut setelahnya </div> Seperti gambar diatas.

Simpan Template

Nb : Kalau masih bingung, lihat kode berikut, yang warna hijau adalah kode yang harus anda sisipkan. Untuk ukuran height bisa anda ganti sesuai selera anda.

<div style='overflow:auto; width:ancho; height:400px;'> <dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt expr:class='"comment-author " + data:comment.authorClass' expr:id='data:comment.anchorName'>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</dt>
<b:if cond='data:comment.author == data:post.author'>
<dd class='owner-Body'>
<p><data:comment.body/></p>
</dd>
<b:else/>
<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>
</b:if>
<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='data:comment.url' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</b:loop>

</dl>
</div>

Jika muncul tulisan seperti ini Template Anda tidak dapat diparse karena tidak well-formed jangan kaget tembahkan lagi kode berikut ini </div> dibawah </dl>

Simpan template Selesai

Semoga Berhasil Kawan.......

Artikel Terkait:

Emotion

Kotak Komentar

Ditulis oleh : Arga Anggriawan | BLOG : This Is My Art
Dalam Judul : Membuat Scroll Pada Komentar
Dalam Kategori : Emotion, Kotak Komentar
Saya hanyalah blogger pemula yang ingin belajar dan berbagi dengan sahabat, Semua artikel blog ini bersumber dari pengalaman saya dari dunia blogger.