Considering most of the site visitors don't read comments, within those who read comments, only few of them would actually say something, it might be a good idea to avoid loading Disqus comments by default. Since Disqus makes enormous amount of requests during creation, disabling it will increase page's loading speed slightly.
Therefore here is a note on how to create a "Show Comments" button to load Disqus comments
onClick event. To improve user experience, the comments count will be pulled using Disqus API and displayed right in this button.
- HTML markup
- Show Disqus comments count
- Load Disqus comments onClick
- Load comments if URL contains #comment
- Full example
data-disqus-urlattribute will be used for polling Disqus comments count using its API.
<div id="disqus_thread"></div>is a placeholder which will be used by Disqus to create comments area.
Show Disqus comments count
Disqus provides count.js officially for generating comments count links, which only has limited functionalities. Luckily, Disqus API also allows getting comments in a more flexible way. A detailed official tutorial "Get comment counts with the API" can be found here.
- Register a Disqus API key first, where only the public key will be needed here.
- Use Disqus API's threads/set method, which takes in Disqus shortname, public key and thread URL.
- The quota for API calls is 1000 per hour. If expected requests are larger than that, please contact Disqus support team to increase the limit.
Load Disqus comments onClick
Load comments if URL contains #comment
If someone enters the page directly targeting to Disqus comments, then comments should be loaded automatically. To do so, trigger click action if
#comment is part of the in coming URL.
Googlebot won't be able to index those comments anymore.