Troubleshooting Disqus Comments
Troubleshoot Disqus comments not displaying on mobile devices. Finally, we also ran into an issue that prevented Disqus comments from displaying on mobile devices. In fact, this issue was asked a few months ago by a Blogger friend on the Magic Company forum, but at the time I did not find myself or found the underlying issue for Disqus comments that were not showing up on mobile.
Finding the reason was not easy because I myself did not follow the application of his comments by Disqus from the beginning.
In this case, the Disqus embed comment actually appears on both computer and mobile. What is not displayed is the comment of the visitor, so if the visitor comments on the desktop, the comment is not displayed on the mobile. Conversely, if visitors leave comments on mobile, they are not displayed on the desktop.
And finally, after looking closely at the code, I also found the reason, and it turned out to be pretty trivial too, hehe … we weren’t careful enough to make us dizzy, hehe…
As we know, the code for this comment is as follows Disqus.
<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>At first glance, there seems to be no problem with the above code. So what caused the error?
Look, it turns out there is a comment in the code for disqus_config, namely code / * and * / as I noted below.
<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>So the code certainly doesn’t work.
So now he’s been caught, right? It turns out that the reason Disqus comments are not showing on mobile is because there is some code that is not working. To fix this, we just need to remove the comment code / * and * / as I noted above.
So if someone is trying to add Disqus to a static page for discussion forums, outside of topics or other topics, use the following code.
<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 = "Name";
(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>To Page _URL replace the URL of the page, for example, https://adeebx.blogspot.com/
The title will replace it with, for example, Blogger Technologies.
