Wednesday, 15 June 2016

Cara Memasang Komentar Disqus Permanen di Blog


Cara Memasang Komentar Disqus Permanen di Blog

Pada kali ini kita akan membahas tentang cara memasang komentar Disqus secara permanen di Blog, Flashback sedikit. Sebelumnya Blog Bang Billy memakai 3 kolom komentar yaitu Disqus, Blogger, dan Facebook dan setelah dipikir" lebih baik Blog Bangbil pindah sepenuhnya ke Disqus dikarenakan 3 kolom komentar tadi tidak muncul di smartphone alias munculnya di komputer doang dan lumayan cukup bikin Blog lemot juga. Dan Disqus sekarang juga sudah mendukung fitur Impor komentar dari Blogger ke Disqus jadi kenapa enggak sepenuhnya aja pindah ke Disqus?

Blog Billy-Art Pada artikel sebelumnya juga sudah membahas tentang Cara Memasang Komentar Disqus, tetapi bedanya pada artikel kali ini adalah secara permanen! dalam artian kita akan membuang semua bawaan pada komentar Blogger dan kita tidak akan lagi memakai komentar dari Blogspot/Blogger.

Komentar Bloggernya kenapa dihapus? Pertama kode html blogger memakan space code html terlalu banyak kedua tentunya supaya blog kita lebih ringan untuk diakses.

Cara Memasang Komentar Disqus Permanen di Blog 


Langkah Pertama : Kita akan menghapus semua code bawaan dari Blogger.

  • masuk ke Blogger > Template > Edit HTML > Jika ada code CSS komentar Blogger seperti gambar dibawah ini silahkan dihapus, cari dengan menggunakan shortcut CTRL + F menggunakan kata kunci Comments / #Comments / .comments
Cara Memasang Komentar Disqus Permanen di Blog

  • Cari kode   <b:includable id='comment-form' Jika sudah ketemu klik ... seperti gambar dibawah 

Cara Memasang Komentar Disqus Permanen di Blog

setelah di klik akan menjadi sepanjang inii.. 

Cara Memasang Komentar Disqus Permanen di Blog

Hapus semua code yang dikotak merah > Lalu tambahkan garis miring pada comment-form dan hasilnya akan seperti gambar dibawah ini

Cara Memasang Komentar Disqus Permanen di Blog

  • Lakukan langkah nomer 2 pada semua code yang di kotaki merah & biru dibawah ini. Sehingga semua kode yang dikotaki hasilnya menjadi seperti gambar dibawah.


Kode yang di kotaki warna merah adalah code pendukung komentar blogger sedangkan yang warna biru adalah tombol berbagi yang jarang banget dipakai oleh pengguna blogger tombol berbagi bawaannya seperti ini.

Tombol Bawaan Blogger

Langkah Kedua : Kita akan memasang komentar Disqusnya

  • Cari kode <b:includable id='comments' var='post'>  jika sudah ketemu ganti semua kode dari <b:includable sampai </b:includable> dengan kode dibawah ini 
    <b:includable id='comments' var='post'>
      <div class='comments' id='comments'>
    <script type='text/javascript'>
                    var disqus_shortname = &quot;USERNAME DISQUS&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;;
                 (function() {
                            var bloggerjs = document.createElement(&quot;script&quot;);
                            bloggerjs.type = &quot;text/javascript&quot;;
                            bloggerjs.async = true;
                            bloggerjs.src = &quot;//&quot;+disqus_shortname+&quot;.disqus.com/blogger_item.js&quot;;
                            (document.getElementsByTagName(&quot;head&quot;)[0] || document.getElementsByTagName(&quot;body&quot;)[0]).appendChild(bloggerjs);
                        })();
                    (function() {
                        var bloggerjs = document.createElement(&quot;script&quot;);
                        bloggerjs.type = &quot;text/javascript&quot;;
                        bloggerjs.async = true;
                        bloggerjs.src = &quot;//&quot;+disqus_shortname+&quot;.disqus.com/blogger_index.js&quot;;
                        (document.getElementsByTagName(&quot;head&quot;)[0] || document.getElementsByTagName(&quot;body&quot;)[0]).appendChild(bloggerjs);
                    })();
        var disqus_shortname = &#39;USERNAME DISQUS&#39;;
        (function () {
            var s = document.createElement(&#39;script&#39;); s.async = true;
            s.type = &#39;text/javascript&#39;;
            s.src = &#39;//&#39; + disqus_shortname + &#39;.disqus.com/count.js&#39;;
            (document.getElementsByTagName(&#39;HEAD&#39;)[0] || document.getElementsByTagName(&#39;BODY&#39;)[0]).appendChild(s);
        }());
                    </script>
      </div>
    </b:includable>

- Ganti USERNAME DISQUS dengan ID Disqus yang bisa kalian dapatkan dii...
- Jika di laman kalian muncul komentar Disqus kalian bisa tambahkan kode ini  <b:if cond='data:blog.pageType == &quot;item&quot;'> dibawah kode <div class='comments' id='comments'>


Jika sudah Simpan Template dan lihat hasilnya! 


Sekian tentang cara memasang komentar Disqus permanen di Blog, semoga tutorialnya mudah dipahami oleh sobat blogger semuanya jika ada yang kurang paham silahkan bertanya di kolom komentar  

bangbil.com adalah sebuah personal blog. Seorang blogger yang masih merangkap sebagai pelajar. Temui aku di Sosial Media :

Berlangganan via Email

Berlangganan artikel terbaru dari blog ini langsung via email.