Ditulis oleh: Ditulis pada: 4/11/2015
Jika Anda searching di Google dengan keyword cara pasang komentar disqus di blogger, tentunya sudah banyak bertebaran tutorial-tutorialnya. Namun jika sekarang kita menggunakan tutorial-tutorial tersebut maka akan terdapat error validasi HTML5 karena mengandung css style di dalam widgetnya.
Untuk itu kini saya akan share cara pasang komentar Disqus valid HTML5 di Blogger. Sebenarnya ini juga adalah untuk memperbaiki pemasangan Disqus di Blogger dengan trik yang sebelumnya saya share dengan penundaan pemuatan komentar Disqus dengan menggunakan kode Disqus untuk website (bukan untuk Blogger)
Dengan trik tersebut memang loading blog menjadi lebih ringan, namun ternyata komentar-komentar yang sudah ada dan tampil di desktop ternyata tidak tampil di mobile kecuali komentar tersebut memang ditambahkan atau ditulis dengan perangkat mobile (tetapi trik ini berjalan di wordpress).
Ternyata memang agar komentar Disqus juga tampil di perangkat mobile maka untuk Blogger harus menggunakan script Disqus yang memang untuk Blogger. Namun seperti yang saya katakan tadi di atas, jika kita mengikuti langkah-langkah penambahan komentar Disqus seperti yang ada di Disqus dengan menambahkan widget di sidebar Blogger, maka kita akan mendapatkan error validasi HTML5 dan lumayan menyumbang loding blog karena penyimpanan javascript dan css di widget sidebar yang seharusnya dipasang di Edit HTML.
Jika Anda ingin mencoba trik saya ini, silahkan ikuti langkah-langkahnya di bawah ini.
Saya anggap Anda sudah membuat akun Disqus, jika belum silahkan buat di sini https://disqus.com/websites/
Setelah berhasil daftar dan login di Disqus, silahkan klik ikon gear (setting) di pojok kanan atas kemudian klik Add Disqus to Site dan silahkan isi datanya sesuai blog Anda. Setelah selesai akan muncul tampilan baru dan klik Universal Code kemudian copy kode seperti ini
var disqus_shortname = 'blahblahblah'; yang kita perlukan adalah username Disqus-nya (blahblahblah)
Kemudian silahkan masuk ke Blogger dan Edit HTML. Copy kode di bawah ini
<script type='text/javascript'>
var disqus_shortname = "kompiajaib";
var disqus_blogger_current_url = "<data:blog.canonicalUrl/>";
if (!disqus_blogger_current_url.length) {
disqus_blogger_current_url = "<data:blog.url/>";
}
var disqus_blogger_homepage_url = "<data:blog.homepageUrl/>";
var disqus_blogger_canonical_homepage_url = "<data:blog.canonicalHomepageUrl/>";
(function() {
var bloggerjs = document.createElement("script");
bloggerjs.type = "text/javascript";
bloggerjs.async = true;
bloggerjs.src = "//"+disqus_shortname+".disqus.com/blogger_item.js";
(document.getElementsByTagName("head")[0] || document.getElementsByTagName("body")[0]).appendChild(bloggerjs);
})();
(function() {
var bloggerjs = document.createElement("script");
bloggerjs.type = "text/javascript";
bloggerjs.async = true;
bloggerjs.src = "//"+disqus_shortname+".disqus.com/blogger_index.js";
(document.getElementsByTagName("head")[0] || document.getElementsByTagName("body")[0]).appendChild(bloggerjs);
})();
</script>
Ganti kode
kompiajaib dengan username Disqus blog Anda yang tadi Anda copy sebelumnya (blahblahblah).
Kemudian silahkan paste kode di atas tepat di bawah kode berikut:
<b:includable id='comments' var='post'>
<div class='comments' id='comments'>
Setelah itu tambahkan kode css di bawah ini di atas kode
]]></b:skin> atau </style>
#comments {display:none;}
.post-comment-link { visibility: hidden; }
Kemudian masuk ke Dashboard Blogger lalu Setting. Pada bagian Comments rubah Who can comments? menjadi Anyone.
Selesai...silahkan simpan template Anda dan coba buka salah satu halaman postingannya.
Atau Anda bisa mencoba memasang komentar Disqus ini dengan alternatif lain pemasangan komentar Disqus DI SINI.