Cara Pasang komentar Disqus di Template Linkmagz

Kotak komentar bawaan blog maupun dari lainnya sseperti facebook maupun kotak komentar dari disqus sebagai tempat untuk respon pengunjung pada artikel/postingan. Interaksi pengunjung dalam menanggapi dapat dilakukan/diketik dan publish melalui kotak komentar. 

Namun pada blogger tersedia kotak komentar blog, lainnya dapat ditambahkan seperti disqus maupun facebook. Untuk menambahkan kotak komentar disqus pada template linkmagz silahkan ikuti langkah-langkah dibawah ini :

1. Tentu sudah daftar di situsnya disqus.

2.  Cari kode: </b:skin> paste kode dibawah ini diatas  kode ]]></b:skin>

/* Tombol Komen Rapi */

.comment-label{text-align:center;padding:20px;display:block}

#comment-loader{margin:15px 0 0;padding:20px 0}

#comment-loader b{background-color:#009688;color:#fff;cursor:pointer;font-weight:600;text-transform:uppercase;text-align:center;padding:10px 20px;margin:15px;margin-top:15px;border-radius:3px;}

.tombolkomen{display: block;margin:0 auto;width: 100%;}

.buttonkomenrapi{float:left;margin: 0 0 10px;border:none;color:#fff;font-weight:700;padding:10px;width:50%;}

.buttonkomenrapi:hover{opacity:.6;cursor:pointer}

.disqus{background:#2e9fff}

.blogger{background:#ff7043}

#comments{width:100%}

#disqus_thread{padding:20px}

#comment-holder .loadmore{display:none}.

/* Tombol Komen Rapi */

.comment-label{text-align:center;padding:20px;display:block}

#comment-loader{margin:15px 0 0;padding:20px 0}

#comment-loader b{background-color:#009688;color:#fff;cursor:pointer;font-weight:600;text-transform:uppercase;text-align:center;padding:10px 20px;margin:15px;margin-top:15px;border-radius:3px;}

.tombolkomen{display: block;margin:0 auto;width: 100%;}

.buttonkomenrapi{float:left;margin: 0 0 10px;border:none;color:#fff;font-weight:700;padding:10px;width:50%;}

.buttonkomenrapi:hover{opacity:.6;cursor:pointer}

.disqus{background:#2e9fff}

.blogger{background:#ff7043}

#comments{width:100%}

#disqus_thread{padding:20px}

#comment-holder .loadmore{display:none}

3. Pasang Tombol Buka Tutup Komentar. Silahkan anda cari kode <b:includable id='commentPicker' var='post'> atau yang seidentik dengan id='commentPicker' tadi. 

Contohnya seperti berikut ini;

<b:includable id='commentPicker' var='post'>

  <b:if cond='data:post.showThreadedComments'>

    <b:include data='post' name='threadedComments'/>

  <b:else/>

    <b:include data='post' name='comments'/>

  </b:if>

</b:includable>

Ganti semua kode tadi dengan kode dibawah ini; 

<b:includable id='commentPicker' var='post'>

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<div id='comment-loader'>

    <b id='buka' onclick='bukakomentar()'>Buka Komentar</b>

    <b id='tutup' onclick='tutupkomentar()' style='display:none'>Tutup Komentar</b>

<script>//<![CDATA[

  function bukakomentar() {

    document.getElementById("buka").style.display="none";

    document.getElementById("tutup").style.display="block";

    document.getElementById("tombolkomen").style.display="block";

  }

  function tutupkomentar() {

    document.getElementById("buka").style.display="block";

    document.getElementById("tutup").style.display="none";

    document.getElementById("tombolkomen").style.display="none";

    document.getElementById("comments").style.display="none";

    document.getElementById("disqus_thread").style.display="none";

  }

setTimeout(function() {

    $('#comments').hide();

}, 1000);

//]]></script>

    <div class='tombolkomen' id='tombolkomen' style='display:none'>

     <button class='buttonkomenrapi disqus' onclick='$.ajaxSetup({cache:true});$.getScript(&quot;https://IDDISQUS.disqus.com/embed.js&quot;);$.ajaxSetup({cache:false}); document.getElementById(&apos;comments&apos;).style.display=&apos;none&apos;; document.getElementById(&apos;disqus_thread&apos;).style.display=&apos;block&apos;;'>Disqus</button>

 <button class='buttonkomenrapi blogger' onclick=' document.getElementById(&apos;comments&apos;).style.display=&apos;inline-block&apos;; document.getElementById(&apos;disqus_thread&apos;).style.display=&apos;none&apos;;'>Blogger</button>

    </div>

   </div>

   <div id='disqus_thread' style='display:none'/>

  </b:if>

<div id='comments-box'>

<b:if cond='data:post.showThreadedComments'>

    <b:include data='post' name='threadedComments'/>

  <b:else/>

    <b:include data='post' name='comments'/>

  </b:if>

</div>

</b:includable>

4. Paste kode dibawah tepat diatas kode </body> :

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<script type='text/javascript'>

//<![CDATA[

var disqus_shortname="GANTINAMA";

var disqus_url = disqus_blogger_current_url;

(function () {

 "use strict";

 var get_comment_block = function () {

 var block = document.getElementById('comments');

 if (!block) {

 block = document.getElementById('disqus-blogger-comment-block');}

 return block;};

 var comment_block = get_comment_block();

 if (!!comment_block) {

 var disqus_div = document.createElement('div');

 disqus_div.id = 'disqus_thread';

 comment_block.innerHTML = '';

 comment_block.appendChild(disqus_div);

 comment_block.style.display = 'block';

 var dsq = document.createElement('script');

 dsq.async = true;

 dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';

 (document.getElementsByTagName('head')[0] || document.body).appendChild(dsq);}

})();

 var divs = ["disqus-box", "blogger-box"];

 var visibleDivId = null;

 function toggleVisibility(divId) {

 if(visibleDivId === divId) {

 visibleDivId = null;} else {

 visibleDivId = divId;}

 hideNonVisibleDivs();}

 function hideNonVisibleDivs() {

 var i, divId, div;

 for(i = 0; i < divs.length; i++) {

 divId = divs[i];

 div = document.getElementById(divId);

 if(visibleDivId === divId) {

 div.style.display = "block"; } else {

 div.style.display = "none"; } } }

$(".commentbtn").click(function (e) {

$(this).addClass("btncurrent").siblings().removeClass("btncurrent");

});

//]]>

</script>

</b:if>

Bila angkah diatas sudah benar namuun kotak komentar disqus belum tampil, silahkan pasang kode/script ini =>  No.6 pada meta tag blog

Cara pasang bisa lihat juga divideo berikut: