Four Cool Ajax Plugins for WordPress

WordPress and all other popular blogging packages have many features specifically designed to make conversations between authors and readers as easy as possible. If you are used to instant messaging, however, you may think nothing is better than instant messaging for a quick on-line conversation. Don't worry; there's no need to leave your beloved WordPress home page to have such conversations. The Ajax-based Wordspew/Shoutbox plugin adds real-time chat functionality to any WordPress Web site. Installation is possibly the simplest one of all the plugins described in this article: unpack the tarball in the WordPress plugins directory, and call Shoutbox with this line of code in the piece of the theme where you want it to appear:

<?php jal_get_shoutbox(); ?>

Figure 4 shows the result. Whenever anyone writes some text in the Message input field, everyone else who is visiting the home page at that moment will see it, without doing anything, the next time the Shoutbox area refreshes itself, and everyone will be able to answer in the same way. Shoutbox users also can add their name and home URL, if they choose, as well as use emoticons or links in the message text.

Figure 4. Shoutbox lets people chat without refreshing the page.

The scrollbar on the right allows newcomers to follow the whole conversation (Figure 5). The refresh interval is programmable. When it expires, new posts appear highlighted in a different color, which then fades away in the background after an equally programmable interval.

Figure 5. You can scroll back to view previous chat messages.

Almost everything else in the Shoutbox is configurable. You can set all the options from the Manage→Live Shoutbox page. The screenshots here show the vanilla version, but you can change the colors of user names, text and background of all comments. Even the one-line input area can be replaced with a larger field, but this obviously uses more space and may ruin the overall layout of your pages. One Shoutbox feature you might want to disable as soon as possible is the sound alert when new messages are loaded. You don't want your coworkers to know when you're chatting in your browser, do you?

Security-conscious readers will immediately spot the potential for abuse here, but Shoutbox has two configurable mechanisms to prevent spammers from filling it with garbage. One is a place (Options→Discussion→Comments moderation) where you can enter a list of banned words, URLs and sentences. The package includes a sample word list; to add new ones, simply type them in the right place on the list. People trying to use banned words will see the alert box shown in Figure 6. The drawback in using the banned word list is that it requires continuous monitoring and maintenance. To avoid this burden, it is much better, without giving up the list itself, to set Shoutbox to accept comments only from registered users. Anonymous visitors still will be able to see the chat in progress.

Figure 6. You can filter profanity, among other things.

Besides English, the Wordspew Shoutbox is also available in about ten other European languages. If your language is already supported, simply download the corresponding PO-MO files from the plugin home page, and place them in the Wordspew folder on the server. Otherwise, the author welcomes localizations in other languages.

Ajax still is a relatively new technology. Depending on which WordPress version you run, how you configured it and which theme you chose, you may experience messed-up internal links, misaligned blocks or similar problems if you download everything described in this article and simply drop it in your WordPress installation.

One reason for these issues is the simple fact that all these plugins are still under active development. In the Calendar version (0.8.3) we tested, for example, one php tag was missing (surely due to a typing mistake before packaging) from the source file called ajaxcalendarscript.php. To make it work, we had to replace <? with <?php on line 89 of that file. Surely all the plugins will have more stable interfaces by the time you read this article.

Another reason is that, at least at the time of this writing, several plugins are packaged with their own copies of the same (or different) versions of some JavaScript library. This spares you having to find those libraries, but it also might confuse some browsers. Install the plugins one at a time, starting from the one you need the most, and don't move to the next until you're sure everything works as you want, and be sure you have a backup of all your WordPress files.

Another trick that can spare you a lot of frustration, not only with these plugins but with any JavaScript-based Web application, is always to keep two windows open during the installation and testing phases. The first one should show, if you have access to it, the last lines of the error log file of your Web server. This will make it evident if things are going wrong because some file is not in the expected location. The other window should be the JavaScript console of Firefox or Mozilla, which is where these browsers report any problems they have with executing the code embedded in a Web page.