Cara Mudah Membuat Tombol Buka Tutup Komentar di Blogger

BroHad.Com - Halooo bro and sis, pada kesempatan kali ini saya akan berbagi sedikit tutorial blogging mengenai cara membuat tombol buka tutup komentar di blog, tombol ini berfungsi untuk tidak menampilkan komentar yang ada di postingan blogger namun akan muncul setelah tombol tersebut di klik (dibuka), dan bisa di tutup kembali ketika diklik lagi.

Tombol buka tutup komentar ini sangat bermanfaat untuk blog anda yang ramai komentarnya, karena akan menghemat ruang ketika kolom komentar tersebut di sembunyikan dengan tombol ini, serta dapat di buka kembali untuk menampilkan seluruh komentar.
Penasaran bagaimana cara untuk membuat tombol buka tutup komentar di blogger ? simak langkah sederhana berikut ini.

Cara Termudah Membuat Tombol Buka Tutup Komentar di Blogger

1. Silahkan masuk ke dashboard blogger anda.

2. Pilih menu Tema / Template.

3. Klik bagian Edit HTML.

4. Cari kode berikut ini atau yang dirasa hampir sama dengan kode berikut ini.
<b:include data='post' name='comments'/>
5. Kemudian silahkan anda ganti kode tersebut dengan seluruh kode berikut ini.
 <b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
.buka-komen,.tutup-komen{font-family:inherit;background:#696969;
background:-moz-linear-gradient(left,#696969 0,#000000 80%,#800000 100%);
background:-webkit-linear-gradient(left,#696969 0,#000000 80%,#800000 100%);
background:linear-gradient(to right,#696969 0,#000000 80%,#800000 100%);;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>
6. Silahkan ubah bagian warna background dengan kode warna html yang sesuai dengan tema blog anda.

7. Klik save / simpan. Selesai.

Nahh .. jadi begitulah cara mudah untuk membuat tombol buka tutup komentar di blog yang bisa saya berikan tutorialnya, semoga bermanfaat dan terima kasih atas kunjungannya.
Nurhadi Bachtiar
Sebaik-baik manusia adalah yang bermanfaat bagi orang lain. Tidak akan putus amalan seseorang kecuali 3 hal "Sedekah Jariyah, Ilmu yang Bermanfaat, dan Do'a Anak yang Shaleh."

Related Posts

Posting Komentar

Subscribe Our Newsletter