New WordPress Plugin: WDP AJAX Comments

by

Today, I am proud to release my first WordPress plugin named “WDP AJAX Comments”. This plugin will enable AJAX Comments on your WordPress Blog and enhance the user experience using nifty on page comment form submission and validation of input before submission.

Features

  • Enable AJAX Commenting
  • Client Side Form Validation
  • Easily rolls back if JS disabled
  • Easily configure custom styles for messages

Download

Download the Plugin from official WordPress Plugin repository.

Installing & Activating

Here’s how to install and use this plugin to its full potential:
1. Firstly, go to Add New Plugin in your WordPress admin panel, and search for wdp ajax comments and you’ll see the listing, install the plugin by clicking on ‘Install’. Or you can go to WordPress plugin repository page and download the plugin and extract it in your wp-content/plugins folder.
2. Now activate this plugin, and your blog is ready with AJAX comment posting, but one thing you still need to do is enabling the client side comment form validation.
3. To enable form validation, refer to the below section.

Enabling Comment Form Validation

This plugin makes use of jQuery Validation plugin to validate comment form, so you will need to add some css classes to your comment form. Here’s how to do that:
1. Open up your theme’s comments.php file in an editor.
2. Find out the code lines where comment form starts.
3. Now, you need to add following CSS classes to comment form inputs:

  • To comment author name input, add class="required"
  • To comment author email input, add class="required email"
  • To comment author URL input, add class="url"
  • To the comment textarea, add class="required"

4. Save the file and now your comment form validation will work.

Styling The Messages

WDP AJAX Comments provides you with full control over the looks of various messages using CSS. To define your own styles, create a new stylesheet file named wdp-ajax-styles.css in your theme’s folder and define styles for these classes:

  • .wdpajax-error This class is used for the message shown when AJAX error is encountered.
  • .wdpajax-success This class is used for success message shown after successful comment submission.
  • .wdpajax-loading This class is used to show the ‘Processing..’ message while performing AJAX request. You can add animated loading gif’s as background to give a nice AJAX effect.
  • label.error This class is used to show validation errors.

If your theme folder does not contain wdp-ajax-styles.css file, the default stylesheet of the plugin will be used.

What to Expect in Coming Versions

Currently, this plugin just AJAXifies comment submission and does not update the comments displayed automatically. So, this is one of the feature you should expect in coming editions. Another feature i have thought is giving you control over the messages displayed on AJAX requests.

If you would like to suggest a new feature, feel free to comment below, just prepend your comment with Suggestion.

If you have used this plugin on your blog, post the address of your blog too, so that other can have a look.
In case you need any assistance, feel free to use the comment section below