Cara Membuat Spoiler pada Kotak Komentar Blogger/Blogspot
Tuesday, April 21, 2015
Tutorial blog kali ini membahas seputar cara membuat/memasang tombol spoiler pada kotak komentar blogger. Kalau kotak komentar blog terlihat memanjang ke bawah karena terlalu banyak para komentator yang berkomentar di blog anda, maka tombol spoiler perlu dipasang agar memudahkan pengunjung blog yang juga akan mengisi komentar di blog anda.
Baca juga : Cara Membuat Spoiler Di Dalam Postingan Blog
Cara Membuat Spoiler pada Kotak Komentar Blogspot :
1. Login ke blogger.com
2. Pilih Template => Edit Html
3. Tekan Ctrl+F lalu cari kode seperti berikut ini
<div class='comments-content'>
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='threaded_comment_js'/>
</b:if>
<div id='comment-holder'>
<data:post.commentHtml/>
</div>
</div>
4. Kalau sudah ditemukan maka letakkan kode berikut diatasnya
<div><div style='margin-bottom: 2px;'><i><b><small/></b></i><input onclick='if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Lihat Komentar'; }' style='margin: 0px; padding: 0px; width: 200px; font-size: 15px;font-weight:bold;' type='button' value='Lihat Komentar'/></div>
<div style='border: 0px inset ; margin: 0px; padding: 0px;'><div style='display: none;'>
5. Lalu letakkan kode penutup </div> dibawah kode warna merah (lihat pada kode diatas)
</div>
</div>
</div>
6. Penerapannya seperti dibawah ini
<div><div style='margin-bottom: 2px;'><i><b><small/></b></i><input onclick='if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Lihat Komentar'; }' style='margin: 0px; padding: 0px; width: 200px; font-size: 15px;font-weight:bold;' type='button' value='Lihat Komentar'/></div>
<div style='border: 0px inset ; margin: 0px; padding: 0px;'><div style='display: none;'>
<div class='comments-content'>
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='threaded_comment_js'/>
</b:if>
<div id='comment-holder'>
<data:post.commentHtml/>
</div>
</div>
</div>
</div>
</div>
7. Selesai, simpan Sumber http://tips-erma.blogspot.com/