Cara Mudah Membuat Tombol Buka Tutup Komentar di Blogger - hapidzfadli
News Update
Loading...

Jumat, 08 Maret 2019

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.

Share with your friends

Give us your opinion

Notification
This is just an example, you can fill it later with your own note.
Done