Cara Membuat Spoiler ( Show / Hide ) Komentar yang Memanjang

Cara ini berguna jika postingan sahabat banyak yang memberi komentar sehingga halaman memanjang sampai bawah penuh dengan kolom komentar. Caranya sangat mudah, di jamin gak pusing kepala. Seperti biasa kenapa aku posting ini karena aku sudah lakukan dan buat dokumentasi. Yuk kita mulai...
1. Log in Blog, Klik Layout, Klik edit HTML, Klik Expand Widget.
2. Cari kode seperti di bawah ini :


.feed-links {
clear: both;
line-height: 2.5em;
margin-left: 13px;
}


Kemudian Coppy kode di bawah ini, Pastekan di atasnya kode tadi.


.commenthidden {
display:none
}
.commentshown {
display:inline
}


3. Langkah selanjutnya cari kode </head> .

Coppy kode di bawah ini dan pastekan di atasnya kode </head>


<script type='text/Javascript'>
function togglecomments (postid) {
var whichpost = document.getElementById(postid);
if (whichpost.className==&quot;commentshown&quot;) {
whichpost.className=&quot;commenthidden&quot;;
}
else {
whichpost.className=&quot;commentshown&quot;;
}
}
</script>


4. Kemudian cari kode seperti di bawah ini :


<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>


Kalau tidak ketemu coba cari kode seperti ini :


<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
<b:loop values='data:post.comments' var='comment'>


Jika sudah ketemu Coppy kode di bawah ini, pastekan diatasnya.


<base target='_self'><h2><a aiotitle='click to expand' href='javascript:togglecomments (&quot;comments-block&quot;)' rel='nofollow'><b> <center><blink>Show All Comment</blink></center></b></a></h2></base>
<dl class='commenthidden' id='comments-block'><br/>


Jangan lupa taruh kode ini </dl> di penutup kode tag.

Contohnya :


<base target='_self'><h2><a aiotitle='click to expand' href='javascript:togglecomments (&quot;comments-block&quot;)' rel='nofollow'><b> <center><blink>Show All Comment</blink></center></b></a></h2></base>
<dl class='commenthidden' id='comments-block'><br/><dl expr:class='data:post.avatarIndentClass' id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
...dan seterusnya sampai...
<a expr:href='data:comment.url' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</b:loop>
</dl>
</dl>


5. Save

Anda Sudah Baca Yang Ini? :