Scroll boxs pada kotak komentar berfungsi untuk menghemat
areal halaman pada postingan selain juga tampilan blog kelihatan rapi. Meskipun
telah dipasang, ada kemungkinan dicopot atau kemudian dipasang lagi, makanya
sekalian disimpan pada bilik halaman ini agar tidak lupa.
Hal ini dapat
dipasang di blog lain bila setelan template sama
Berikut
langkah-langkah cara memasangnya :
Langkah Pertama
1. Login kea kun blog (Muncul tampilan dasbor
blog),
2. Pilih dan klik setelan blog
3. Pilih Post dan Komentar
4. Pada lokasi komentar pilih”Jendela Munculan”
5. Klik Simpan setelan (disudut kanan atas)
Langkah Kedua
1. Setelah login ke akun blog,
2. Pilih atau klik Rancangan / templates
3. Pilih Edit HTML
4. Jangan lupa centang/aktifkan pilihan Expand
Widget Templates.
Langkah Ketiga
Silakan tekan Ctrl+F
pada keyboard dan cari kode di bawah ini
<div expr:id='data:widget.instanceId + "_comments-block-wrapper"'>
Kalau sudah ketemu kodenya, silakan copypaste kode di bawah ini pas di atas kode tadi.
Lalu jangan lupa tambahkan kode </div> untuk penutupnya di bawab </dl>
<div style='background-color:#cceaef;overflow:auto;width:ancho; height:300px;'>
Setalah di copypaste kode (lengkap-nya) menjadi di bawah ini.
<div style='background-color:#cceaef;overflow:auto; width:ancho; height:300px;'>
<div expr:id='data:widget.instanceId + "_comments-block-wrapper"'>
<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt expr:class='"comment-author " + data:comment.authorClass' expr:id='data:comment.anchorName'>
<b:if cond='data:comment.favicon'>
<img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
</b:if>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:blog.enabledCommentProfileImages'>
<data:comment.authorAvatarImage/>
</b:if>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl'>
<data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</dt>
<dd class='comment-body' expr:id='data:widget.instanceId + data:comment.cmtBodyIdPostfix'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p>
<data:comment.body/>
</p>
</b:if>
</dd>
<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>
<div expr:id='data:widget.instanceId + "_comments-block-wrapper"'>
<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt expr:class='"comment-author " + data:comment.authorClass' expr:id='data:comment.anchorName'>
<b:if cond='data:comment.favicon'>
<img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
</b:if>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:blog.enabledCommentProfileImages'>
<data:comment.authorAvatarImage/>
</b:if>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl'>
<data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</dt>
<dd class='comment-body' expr:id='data:widget.instanceId + data:comment.cmtBodyIdPostfix'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p>
<data:comment.body/>
</p>
</b:if>
</dd>
<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>
</div>
Kode yang berwarna merah, height:300px untuk mengatur tinggi areal kotak komentar, </div> merupakan penutup di bawah </dl>
Sebelum di save klik Pratinjau dahulu
Demikian Disimpen Ben Ra Lali, semoga bermanfaat
ARTIKEL TERKAIT
Di bawah ini adalah beberapa materi lanjutan dan sebelumnya yang berkaitan dengan materi di atas