✔ Cara Menciptakan Tombol Buka Dan Tutup Komentar Disqus Pada Blogger

Untuk menciptakan tombol komentar pada blogger menjadi buka tutup diharapkan penambahan script atau lebih persisnya penggantian aba-aba HTML komentar pada template yang anda gunakan dengan aba-aba html yang akan saya bagikan di bawah ini sehingga komentar pada blog anda terdapat tombol buka tutup.

Salah satu alasan mengapa anda perlu menciptakan Show Hide Komentar pada blogger ialah untuk menciptakan tampilan blog menjadi lebih simple lagi dan Pembaca blog anda akan lebih fokus ke isi halaman postingan konten.

Selain itu dengan menciptakan tombol Show hide komentar pada blogger, komentar yang menjuntai kebawah yang terdapat pada postingan anda tidak akan tampil sebelum pengunjung mengklik tombol buka komentar dengan begitu tampilan blog anda akan lebih simple dan minimalis dengan adanya tombol buka tutup komentar pada blogger.

Cara Membuat Tombol Buka Tutup Komentar

Cara pertama untuk menciptakan tombol show hide komentar pada blog ialah menyerupai biasa anda perlu masuk ke hidangan tema pada akun blogger anda kemudian klik pada edit HTML sehingga anda sanggup merubah data struktur pada template yang anda gunakan.

Baca juga : Cara buat tombol chat whatsapp melayang di blogger

Selanjutnya cari aba-aba di bawah ini atau yang serupa dengan aba-aba di bawah ini.

<b:include cond='data:blog.pageType in {&quot;static_page&quot;,&quot;item&quot;}' data='post' name='comments'/>

Untuk memudahkan mencari aba-aba diatas gunakan ctrl+f pada keyboard kemudian pastekan aba-aba diatas di dalam kotak pencarian. Jika anda kesulitan dalam mencari aba-aba di atas coba ambil potongan aba-aba diatas sebagian saja.


Setelah aba-aba di atas ketemu silahkan block semua kemudian gantikan dengan aba-aba di bawah ini.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
 <style>
 .buka-komen,.tutup-komen{font-family:inherit;background-color:#11589D;color:#fff;font-size:16px;line-height:1.3em;padding:8px 10px;text-align:center;font-weight:700;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;-webkit-transition:all 218ms;-moz-transition:all 218ms;-o-transition:all 218ms;transition:all 218ms;-webkit-user-select:none;-moz-user-select:none;margin:20px 0 0;cursor:pointer;}
 .buka-komen{display:block;margin-bottom:20px}
 #comments-box{display:none}
 </style>
 <div aria-label='Buka Komentar' class='buka-komen' id='buka-komen' onclick='document.getElementById(&quot;comments-box&quot;).style.display=&quot;block&quot;;document.getElementById(&quot;tutup-komen&quot;).style.display=&quot;block&quot;;document.getElementById(&quot;buka-komen&quot;).style.display=&quot;none&quot;' role='button' tabindex='0'>Buka Komentar</div>
 <div aria-label='Tutup Komentar' class='tutup-komen' hidden='hidden' id='tutup-komen' onclick='document.getElementById(&quot;comments-box&quot;).style.display=&quot;none&quot;;document.getElementById(&quot;tutup-komen&quot;).style.display=&quot;none&quot;;document.getElementById(&quot;buka-komen&quot;).style.display=&quot;block&quot;' role='button' tabindex='0'>Tutup Komentar</div>
 </b:if>
 <div id='comments-box'>
         <b:include cond='data:blog.pageType in {&quot;static_page&quot;,&quot;item&quot;}' data='post' name='comments'/>
           </div>

Langkah terakhir klik simpan perubahan tema, Untuk melihat hasil tombol buka tutup komentar pada blogger yang sudah anda buat silahkan buka salah satu postingan anda kemudian lihat pada bab komentar postingan anda.

Sebagai pelengkap untuk mengganti warna tombol buka tutup komentar pada blog silahkan ganti aba-aba yang saya beri warna merah dengan warna color yang anda inginkan. Dan perlu di ingat bahwa aba-aba di atas bukanlah trik untuk menunda pemuatan komentar pada blog tetapi hanya untuk buka tutup komentar saja.
Sumber http://www.masigun.com

Share this post

Berlangganan update artikel terbaru via email: