jQuery Disqus Features
This is an update/elaboration of an old jQuery Disqus plugin. The Disqus API is changing very rapidly, so it's important to have an up-to-date plugin.
jQuery Disqus has the following features:
- Callback support for when a comment is added and/or edited.
- Optional Syntax Highlighting support, giving commenters the power of pretty code. Uses the Google Prettify Library (which StackOverflow uses).
- Simplified support for retrieving comment and reaction counts.
Install the jQuery Disqus Plugin
jQuery Disqus has opt-in support for Markdown and Syntax Highlighting. If you have included showdown.js and set
markdown: true, you will get Markdown enabled Disqus comments. If you include prettify.js and set
prettify: true, your Disqus comments will be syntax highlighted. Both of these are optional.
Here's how you would set that up. Add this to your HTML head:
That will take a node with
id='disqus_thread' (div or any other node), append your Disqus comments, apply syntax highlighting, run them through the Markdown processor, and give your iframe (which just holds the textarea) custom css. It also shows how to retrieve Disqus' comment and reaction counts for the current page:
You can also retrieve the comment and reaction counts for a list of links (say for the index page of your blog), like this:
The link will be rendered like this:
The original link's href is given some slack, and can be written like any of these:
In the end, they will all be replaced with the absolute url above.
Customizing Your Disqus
Here are some helpful jQuery methods to give you a head start in customizing Disqus:
Let me know how you like it!