Cara Memasang Tombol Show Hide Comment Disqus Ala Kompi Ajaib

Cara Memasang Tombol Show Hide Comment Disqus Ala Kompi Ajaib. Setelah postingan sebelumnya saya membagikan tutorial tentang Cara Memasang Tombol Show Disqus Comments Di Blog, maka kali ini saya akan melengkapinya dengan Tombol Hide, pada dasarnya fungsi dari tombol ini adalah sama saja, namun pada tutorial sebelumnya hanya bisa menampilkan Disqus Comment tetapi tidak bisa menyembunyikannya kembali, nah pada tutorial kali ini akan saya lengkapi dengan menambahkan tombol Hide, sehingga Disqus Comment akan dapat ditampilkan dan disembunyikan kembali.

.disqus-title{margin:0;text-align:left;background:#efefef;padding:6px 10px;color:#444!important;font-size:100%;font-weight:500;border: 1px solid #ddd;}


.disqus-loader,#disqus-showhide{float:right;cursor:pointer}


#disqus-showhide{display:none}

<div class='disqus-title' id='disqus-title'>Disqus Comments<span class='disqus-loader' id='disqus-loader' onclick='loadDisqus()'>Load</span><span id='disqus-showhide' onclick='toggleDisqus(&apos;disqus-comments&apos;)'>Hide</span></div>


<div id='disqus-comments'>


<div class='comments' id='comments'>


<script type='text/javascript'>


var disqus_shortname = &quot;DISQUS-USERNAME&quot;;


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>


</div>


</div>

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


<div class='disqus-title' id='disqus-title'>Disqus Comments<span class='disqus-loader' id='disqus-loader' onclick='loadDisqus()'>Load</span><span id='disqus-showhide' onclick='toggleDisqus(&apos;disqus-comments&apos;)'>Hide</span></div>


<div id='disqus-comments'>


<div class='comments' id='comments'>


<script type='text/javascript'>


var disqus_shortname = &quot;DISQUS-USERNAME&quot;;


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>


</div>


</div>


</b:includable>

<script type='text/javascript'>


//<![CDATA[


function toggleDisqus(e){var n=document.getElementById(e),l=document.getElementById("disqus-showhide"),t="none";n.style.display==t?(n.style.display="block",l.innerHTML="Hide"):(n.style.display="none",l.innerHTML="Show")};


//]]>


var disqus_shortname = "DISQUS-USERNAME";


function loadDisqus(){var e=document.getElementById("disqus-loader");e.style.display="none";var e=document.getElementById("disqus-showhide");e.style.display="block";!function(){var e=document.createElement("script");e.type="text/javascript",e.async=!0,e.src="//"+disqus_shortname+".disqus.com/blogger_item.js",(document.getElementsByTagName("head")[0]||document.getElementsByTagName("body")[0]).appendChild(e)}();}


</script>