Menyembunyikan Komentar Blog Dengan Tombol Show Hide

gacerindo - Halo sobat mamang, sebelumnya mamang pernah membahas cara menyembunyikan komentar untuk blog AMP dengan tombol show hide. Rasanya kurang pas, kalau tidak ada kode yang sama tapi untuk blog non amp.
Bagi yang ingin mempraktekan tombol show hide komentar untuk blog amp, silahkan baca disini.
Bagi sobat mamang yang ingin memakai sistem buka tutup untuk komentar blog amp. Boleh deh dicoba oleh kamu. Berikut langkah-langkahnya.
Pertama, masuk ke template > edit HTML.
Kedua, silahkan cari kode dibawah atau minimal mirip dengan kode dibawah ini.

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

Ketiga, Ganti kode diatas, dengan kode berikut 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>

Selesai, jangan lupa save template kamu ya.
Jika warna backgroundnya tidak cocok dengan template kamu, atau kamu ingin merubahnya silahkan ganti pada bagian kode ini background-color:#11589D;color:#fff;.
Bagaimana mudah bukan, silahkan bagi yang tertarik langsung dipraktekan ya.
Credit to: Kompi Ajaib