Memasang Kolom Komentar Disqus Untuk Blogger

Memasang kolom komentar Disqus membuat kolom komentar blog kita tampak bagus karena kolom komentar Disqus tampilannya enak untuk dilihat. Tapi kelemahan kolom komentar Disqus akan memperberat load di blog kita.

Jadi bila ingin memasang kolom komentar Disqus disini kita akan memberikan langkah-langkahnya.

Pertama menambahkan gadget Disqus

1. Masuk ke menu Tata Letak dan klik Tambahkan Gadget pada Sidebar

2. Dalam popup Tambahkan Gadget, cari HTML/Javascript gadget dan klik tombol +

3. Masukan judul dengan Disqus dan konten dengan <!-- Disqus comments gadget -->

4. Klik Simpan

5. Lalu klik Simpan stelan

Kedua menambahkan kode Disqus pada template

1. Masuk ke menu Template dan klik Edit HTML

2. Cari kode (Ctrl+F)

<b:widget id='HTML1' locked='false' title='Disqus' type='HTML'>

3. Tambahkan kode mobile='yes' 

<b:widget id='HTML1' locked='false' mobile='yes' title='Disqus' type='HTML'>

4. Cari kode widget Disqus. Kodenya seperti ini:

<b:includable id='main'>
 <!-- only display title if it's non-empty -->
 <b:if cond='data:title != &quot;&quot;'>
  <h2 class='title'><data:title/></h2>
 </b:if>
 <div class='widget-content'>
  <data:content/>
 </div>
 <b:include name='quickedit'/>
</b:includable>

5. Ganti kode diatas dengan kode Disqus. Seperti ini:

<b:includable id='main'>
 <script type='text/javascript'>
  var disqus_shortname = &#39;EXAMPLE&#39;;
  var disqus_blogger_current_url = &quot;<data:blog.canonicalUrl/>&quot;;

  if (!disqus_blogger_current_url.length) {
   disqus_blogger_current_url = &quot;<data:blog.url/>&quot;;
  }

  var disqus_blogger_homepage_url = &quot;<data:blog.homepageUrl/>&quot;;
  var disqus_blogger_canonical_homepage_url = &quot;<data:blog.canonicalHomepageUrl/>&quot;;
 </script>

 <b:if cond='data:blog.pageType == &quot;item&quot;'>
  <style type='text/css'>
   #comments {display:none;}
  </style>

  <script type='text/javascript'>
   (function() {
    var bloggerjs = document.createElement(&#39;script&#39;);
    bloggerjs.type = &#39;text/javascript&#39;;
    bloggerjs.async = true;
    bloggerjs.src = &#39;//&#39;+disqus_shortname+&#39;.disqus.com/blogger_item.js&#39;;
    (document.getElementsByTagName(&#39;head&#39;)[0] || document.getElementsByTagName(&#39;body&#39;)[0]).appendChild(bloggerjs);
   })();

  </script>
 </b:if>
  <style type='text/css'>
   .post-comment-link { visibility: hidden; }
  </style>

  <script type='text/javascript'>
  (function() {
   var bloggerjs = document.createElement(&#39;script&#39;);
   bloggerjs.type = &#39;text/javascript&#39;;
   bloggerjs.async = true;
   bloggerjs.src = &#39;http://&#39;+disqus_shortname+&#39;.disqus.com/blogger_index.js&#39;;
   (document.getElementsByTagName(&#39;head&#39;)[0] || document.getElementsByTagName(&#39;body&#39;)[0]).appendChild(bloggerjs);
  })();

 </script>
</b:includable>

Ingat ganti EXAMPLE dengan shortname disqus kita. 

Contoh shortname disqus saya ialah serverrendi.

6. Klik Simpan template

7. Selesai, lalu lihat salah satu postingan kita akan muncul kolom komentar Disqus

Jika kolom komentar Disqus tidak muncul, boleh diskusi disini.

Terima kasih 

Enjoy your day!