WpDisqusRc, or WordPress Disqus Recent Comments Widget, is a small script that you can drop into a Text Widget in WordPress. With just a few options, you can display the most recent comments for your Disqus-enabled site!
UPDATE 12-17-2012: Version 0.3 – Added fade in/out animation to popup (Webkit browsers only).
UPDATE 12-11-2012: I decided, since the popup can always be overridden, to make the popup of the author information a default feature. I added the ability to enable/disable the popup as well. This will result in a more simple implementation.
I heard a lot about Disqus (which I still pronounce as dis–kuhs) and decided to implement it at this site. I can tell you that Disqus is a pretty cool SaaS tool that is very easy to implement. All I did was simply install the WordPress Plugin, registered on the Disqus site, set some options, and, voila, you’ve got an awesome commenting system.
It’s important to note that Disqus actually tries to sync its data with your local WordPress comment database. It takes a little bit of time, but this does actually work. The problem, however comes when WordPress’ default Recent Comments widget is used. The links to the referenced posts are incorrect since they point to the record ID of the comment for your WordPress database, not the comment ID of Disqus. So, unfortunately, it won’t scroll down to the comment you clicked on.
I did a quick search for some Disqus widgets online, but really didn’t find any I liked. There was one by Ivan Zlatev, but it wasn’t updated for a few years. Plus, it had a 2 and a half star rating. And he’s a .NET programmer (haha no offense, seriously, one of my co-workers whom I respect very much is a .NET programmer :-)). Anyway, I decided to roll my own.
- Upload the script to your WordPress site somewhere.
- Create a Text Widget.
- Set options (
Once you’ve done that, you should be all set.
In this version, I decided, as a built-in feature, to add listeners to the author’s name tag that will display a popup that would show more information about the author. Note that you can change this behavior by overriding the
mouseout events however you want (e.g. maybe you want to show a popup similar to LightBox or Shadowbox). All you’ll need to do is copy and paste the following into a Text Widget:
Note that you can format the popup via CSS, by using the
.wp-disqus-rc-popup class. You may also want to put the CSS in a separate file. In this case, however, I embedded it in the Text Widget.
Currently, this project is in beta, version 0.2. It’ll probably stay that way while I receive feedback and suggestions on it. This project is released under the MIT License. At some point, if there’s enough interest, I’ll create an actual WordPress Widget UI that would make it easier to set the options.
- Compatible with Webkit (Chrome and Safari) and Gecko (Firefox) browsers.
- Compatible with IE9 and above, not tested in IE8 and less.
- Not tested with Presto (Opera) browsers.
- Should work in mobile devices that use Chrome or Safari.
- Currently you can only hover on the author’s name to invoke the
Code and demo files can be downloaded here.