Ditulis oleh: Ditulis pada: 8/12/2020
Mengatasi Komentar Disqus yang Tidak Muncul di Mobile - Akhirnya ketemu juga masalah yang menyebabkan komentar Disqus tidak muncul di mobile. Sebenarnya masalah ini ditanyakan oleh sahabat Blogger di Forum Kompi Ajaib beberapa bulan yang lalu, namun saat itu saya sendiri tidak atau belum menemukan pokok masalahnya untuk komentar Disqus yang tidak muncul di mobile tersebut.
Cukup pusing juga untuk mencari penyebabnya karena saya sendiri tidak mengikuti penerapan komentar Disqus-nya dari awal.
Pada kasus ini, sebenarnya embed komentar Disqus itu sendiri muncul baik di desktop dan juga di mobile. Yang tidak muncul itu komentar dari pengunjungnya, jadi jika pengunjung berkomentar di desktop maka komentarnya tidak muncul di mobile. Begitu pun sebaliknya, jika pengunjung berkomentar di mobile maka komentarnya tidak muncul di desktop.
Dan akhirnya setelah saya pelototin kodenya secara teliti, ketemu juga penyebabnya dan ternyata cukup sepele juga hehehe... kitanya saja yang kurang teliti sehingga kita malah dibuat pusing hehehe....
Seperti kita ketahui, kode untuk komentar Disqus ini seperti berikut ini.
<div id="disqus_thread"></div>
<script>
/**
* RECOMMENDED CONFIGURATION VARIABLES: EDIT AND UNCOMMENT THE SECTION BELOW TO INSERT DYNAMIC VALUES FROM YOUR PLATFORM OR CMS.
* LEARN WHY DEFINING THESE VARIABLES IS IMPORTANT: https://disqus.com/admin/universalcode/#configuration-variables*/
/*
var disqus_config = function () {
this.page.url = PAGE_URL; // Replace PAGE_URL with your page's canonical URL variable
this.page.identifier = PAGE_IDENTIFIER; // Replace PAGE_IDENTIFIER with your page's unique identifier variable
};
*/
(function() { // DON'T EDIT BELOW THIS LINE
var d = document, s = d.createElement('script');
s.src = 'https://shortname.disqus.com/embed.js';
s.setAttribute('data-timestamp', +new Date());
(d.head || d.body).appendChild(s);
})();
</script>Kalau dilihat sepintas, sepertinya tidak ada masalah dengan kode di atas. Lantas apa yang menyebabkannya error?
Coba perhatikan, ternyata ada komentar pada kode untuk disqus_config yaitu kode /* dan */ seperti yang saya tandai berikut ini.
<div id="disqus_thread"></div>
<script>
/**
* RECOMMENDED CONFIGURATION VARIABLES: EDIT AND UNCOMMENT THE SECTION BELOW TO INSERT DYNAMIC VALUES FROM YOUR PLATFORM OR CMS.
* LEARN WHY DEFINING THESE VARIABLES IS IMPORTANT: https://disqus.com/admin/universalcode/#configuration-variables*/
/*
var disqus_config = function () {
this.page.url = PAGE_URL; // Replace PAGE_URL with your page's canonical URL variable
this.page.identifier = PAGE_IDENTIFIER; // Replace PAGE_IDENTIFIER with your page's unique identifier variable
};
*/
(function() { // DON'T EDIT BELOW THIS LINE
var d = document, s = d.createElement('script');
s.src = 'https://shortname.disqus.com/embed.js';
s.setAttribute('data-timestamp', +new Date());
(d.head || d.body).appendChild(s);
})();
</script>Sehingga dengan begitu maka kode tersebut tentu saja tidak berfungsi.
Nah sekarang sudah ketahuan kan? Ternyata penyebab komentar Disqus tidak muncul di mobile itu adalah karena ada kode yang tidak berfungsi. Untuk mengatasinya, kita tinggal menghapus kode komentar /* dan */ seperti yang saya tandai di atas tadi.
Jadi jika ada yang mencoba untuk menambahkan Disqus di halaman statis untuk forum diskusi, ruang out of topics, atau lainnya, silahkan gunakan kode berikut ini.
<div id="disqus_thread"></div>
<script>
/**
* RECOMMENDED CONFIGURATION VARIABLES: EDIT AND UNCOMMENT THE SECTION BELOW TO INSERT DYNAMIC VALUES FROM YOUR PLATFORM OR CMS.
* LEARN WHY DEFINING THESE VARIABLES IS IMPORTANT: https://disqus.com/admin/universalcode/#configuration-variables*/
var disqus_config = function () {
this.page.url = "PAGE_URL"; // Replace PAGE_URL with your page's canonical URL variable
this.page.identifier = PAGE_IDENTIFIER; // Replace PAGE_IDENTIFIER with your page's unique identifier variable
};
this.page.title = "JUDUL_LAMAN";
(function() { // DON'T EDIT BELOW THIS LINE
var d = document, s = d.createElement('script');
s.src = 'https://shortname.disqus.com/embed.js';
s.setAttribute('data-timestamp', +new Date());
(d.head || d.body).appendChild(s);
})();
</script>Untuk PAGE_URL silahkan ganti dengan URL Lamannya, misalnya https://www.kompiajaib.com/p/forum-kompi-ajaib.html
Untuk JUDUL_LAMAN silahkan ganti dengan judul lamannya, misalnya Forum Diskusi.
Untuk shortname silahkan ganti dengan shortname Disqus blog Anda.
Selesai, semoga bermanfaat.