Cara Membuat Spoiler Komentar Show/Hide di Blog

Dengan adanya tombol spoiler atau tombol buka tutup yang ada diatas kotak / form komentar, akan membuat tampilan blog anda semakin menarik karena tampilan dari komentar dari pengunjung tidak melorot / memanjang ke bawah, jadi lebih simple dan juga tidak membuat loading blog makin berat.

 

       

  

Cara Membuat Spoiler / Tombol Buka Tutup Pada Komentar Blogspot :
1. Login ke Blogger
2. Pilih Template => Edit Html
3. Klik Expand Template
4. Pada keyboard, tekan  F3 dan cari kode seperti dibawah 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>

5. Selanjutnya letakkan kode berikut diatasnya

<div><div style='margin-bottom: 2px;'><i><b><small/></b></i><input onclick='if (this.parentNode.parentNode.getElementsByTagName(&apos;div&apos;)[1].getElementsByTagName(&apos;div&apos;)[0].style.display != &apos;&apos;) { this.parentNode.parentNode.getElementsByTagName(&apos;div&apos;)[1].getElementsByTagName(&apos;div&apos;)[0].style.display = &apos;&apos;; this.innerText = &apos;&apos;; this.value = &apos;Hide&apos;; } else { this.parentNode.parentNode.getElementsByTagName(&apos;div&apos;)[1].getElementsByTagName(&apos;div&apos;)[0].style.display = &apos;none&apos;; this.innerText = &apos;&apos;; this.value = &apos;Silahkan Lihat Komentar&apos;; }' style='margin: 0px; padding: 0px; width: 200px; font-size: 15px;font-weight:bold;' type='button' value='Silahkan Lihat Komentar'/></div>
<div style='border: 0px inset ; margin: 0px; padding: 0px;'><div style='display: none;'>

6. Belum selesai ya? soalnya kodenya belum ada penutupnya. Selanjutnya letakkan kode berikut dibawah kode warna merah :

 </div>
</div>
</div>

7. Nah sekarang selesai nih, trus simpan aja template and silahkan lihat hasilnya.

Sekian dari saya, selamat mencoba dan semoga bermanfaat.

Anda sedang membaca artikel tentang Cara Membuat Spoiler Komentar Show/Hide di Blog. Anda bisa bookmark halaman ini dengan URL https://jejak-blogku.blogspot.com/2013/07/cara-membuat-spoiler-komentar-showhide.html. Jika Anda menyukai Artikel di blog ini, Silakan masukkan email Anda di bawah ini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit.

Bagikan artikel ini :

Description: Cara Membuat Spoiler Komentar Show/Hide di Blog
Rating: 4
Reviewer: Aditya Agus N
ItemReviewed: Cara Membuat Spoiler Komentar Show/Hide di Blog

Artikel Terkait

Trik Blog

• Cara Memasang Widget Twitter Streaming Tweet di Blog
• Membuat Loading Animasi Blogspot Mirip Startup Windows 8
• Mengubah Lebar Kotak Komentar di Blogger
• Membuat Widget Blog Tampil di Halaman Tertentu
• Cara Membuat Headline Artikel di Blog
• Cara Membuat Gadget Di Elemen Footer
• Parse HTML
• Cara Ganti Kursor Blog
• HTML Warna
• Cara Membuat Tombol Back To Top (Versi 2)
• Cara Membuat Recent Post Berjalan Horizontal