Fitur komentar Disqus merupakan salah satu fitur komentar paling populer yang banyak dipasang di blog. Memasang komentar Disqus untuk Blogger juga termasuk gampang. Biasanya komentar Disqus secara otomatis akan termuat begitu halaman sebuah blog sudah terbuka. Agar fitur komentar Disqus ini tidak termuat secara otomatis sehingga tidak membebani loading halaman blog pada saat dibuka, kita bisa membuat sebuah tombol komentar yang akan memuat komentar Disqus ketika tombol tersebut diklik.
Untuk memasang tombol komentar Disqus seperti yang ada di blog Sentra Blogger ini, hal pertama yang perlu diperhatikan adalah jika di blog Anda sudah terpasang widget Disqus, silakan hapus terlebih dahulu supaya tutorial ini bisa bekerja dengan baik. Berikut langkah-langkahnya :
1. Pastikan blog Anda sudah terpasang script JQuery, jika belum silakan pasang kode berikut setelah atau di bawah <head>. Jika sudah ada, abaikan saja.
Untuk memasang tombol komentar Disqus seperti yang ada di blog Sentra Blogger ini, hal pertama yang perlu diperhatikan adalah jika di blog Anda sudah terpasang widget Disqus, silakan hapus terlebih dahulu supaya tutorial ini bisa bekerja dengan baik. Berikut langkah-langkahnya :
1. Pastikan blog Anda sudah terpasang script JQuery, jika belum silakan pasang kode berikut setelah atau di bawah <head>. Jika sudah ada, abaikan saja.
<script async='async' src='https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js'></script>
button#bloggerDisqus {
background-color:#42c0fb; /* Warna tombol */
color: #0000ff;
font: normal 600 16px 'Roboto',sans-serif;
line-height: 0px;
text-align: center;
width: 100%;
border-width: 0px;
padding: 20px 10px;
cursor: pointer;
transition: all .5s ease;
border-radius: 3px;
-moz-border-radius: 3px;
}
button#bloggerDisqus:hover {
background: #ea6153; color: #fff; /* Warna tombol ketika disorot */
}
<div class="disqus-blogger-comment-block"/>
<button id="bloggerDisqus">Buka Komentar</button> <!--Tulisan di tombol -->
<b:if cond='data:view.isPost'> <script> //<![CDATA[
// Call Disqus On Click by Sentra Blogger
window.disqus_blogger_current_url = $('link[rel=canonical]').attr('href');
window.disqus_shortname = 'sentra-blogger'; // Ganti dengan shortname Disqus Anda
$('#bloggerDisqus').on('click', function(){
$.ajax({
type: 'GET',
url: '//' + disqus_shortname + '.disqus.com/blogger_item.js',
dataType: 'script',
cache: true
});
$(this).fadeOut();
});
//]]> </script> </b:if>