Cara Membuat Show Hidden Komentar Blog

Cara Membuat Show Hidden Komentar Blog
Update lagi nih sebelumnya sih memang suka update tapi semenjak beberapa hari belakang jarang update karena lagi sibuk sibuknya tapi tenang aja karena sekarang saya bisa update lagi dan membagikan Tutorial tentunya.

Kembali ke topik yaitu Membuat Show Hidden Komentar, apa sih kegunaan dari Show Hidden Komentar ? tentu saja ada apalagi bisa meringankan loading blog karena fungsinya dengan Onclick jadi si pengunjung bila ingin berkomentar harus mengklik dulu baru bisa komen.

Terkadang memang banyak yang tidak menggunakan cara ini karena biasanya langsung ke komentar saja tanpa perlu Onclick mungkin mereka tidak tahu fungsi tambahan nya seperti meringankan komentar blog pasti buat kalian yang blognya banyak tuh isi komen sampai ratusan pakai cara ini pasti bikin ringan karena waktu loading akan lebih cepat. Untuk tutorial kalian bisa simak caranya dibawah ini apalagi karena saya lagi Puasa jadi sambil ngabuburit ceritanya bikin artikel

Membuat Show Hidden Komentar


1. Buka Blogger > Klik Template > Cari kode seperti berikut <div class='comments' id='comments'>

Ps: biasanya terdapat dua kode seperti diatas
kalian ganti kode kedua dengan kode dibawah ini
 <a href="#" id="comments-show" class="showcontent" onclick="showComm('comments');return false;">Show comments</a><div class='clear'/>
<div class='comments hide-content' id='comments'><a href="#" id="comments-hide" class="hiddencontent" onclick="showComm('comments');return false;">Hide comments</a><div class='clear'/> 
2. Tambahkan kode dibawah ini sebelum ]]></b:skin> atau </style> lebih tepatnya taruh kode diatasnya
 /* Show and Hide Comments */
.hide-content{display:none;margin:0;padding:0;}
a.showcontent,#comments a.hiddencontent{display:block;text-decoration:none;position:relative;color:#fff;font-weight:700;font-size:15px;padding:12.5px 0;background:#43ce8e;border:2px solid;border-radius:5px;text-align:center;margin:30px auto;letter-spacing:1px;transition:all .3s}
#comments a.hiddencontent {background:#fff;color:#acb3b8;transition:all .3s}
a.showcontent:hover{background:#fff;color:#43ce8e;}
#comments a.hiddencontent:hover{background:#acb3b8;color:#fff;} 
3. Tambahkan kode dibawah ini taruh diatas </body>
 <script type='text/javascript'>
//<![CDATA[
// Show and Hide Comments
function showComm(e){document.getElementById(e)&&("none"!=document.getElementById(e+"-show").style.display?(document.getElementById(e+"-show").style.display="none",document.getElementById(e).style.display="block"):(document.getElementById(e+"-show").style.display="block",document.getElementById(e).style.display="none"))};
//]]>
</script> 
4. Terakhir, simpan template

Bagaimana mudah tidak? kalau mudah saya sangat bersyukur karena itu kalian menyimak dengan baik tutorial ini. Demikin tutorial dari saya Cara Menambahkan Show and Hide Comments Blogger dengan Onclick Event. Jika ada kesulitan silahkan tanyakan lewat kolom komentar, sekian terima kasih dan selamat berbuka jika suda waktunya

Berlangganan update artikel terbaru via email:

Show comments
Hide comments

0 Response to "Cara Membuat Show Hidden Komentar Blog"

Post a Comment

Centang kotak "NOTIFT ME" agar mendapatkan notifikasi melalui email ketika ada yang membalas komentar kamu.

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel

Δ