jQuery Comment Preview WordPress Plugin

jQuery Comment Preview WordPress Plugin allows the live comment preview without page reboot. It works on jQuery.

Requires WordPress version: 2.3 or higher.

You can see an example on a current site.

Plugin features

• Live comment preview, which does not take that extra space on the page.
• Simple HTML-editor (instructions on using the editor are on the plugin options page).
• You can customize comment preview block as you wish. You can display: comment author name, avatar (static or dinamic using gravatar.com), comment date and time, comment text. All this can be designed with CSS.
• You may don’t connect plugin’s CSS file (optional) if you wish to reduce number of queries to your server.
• Plugin’s JS and CSS files are connected only on the pages with comment form.

Download

Attention: knowledge of CSS and HTML may require for using a plugin.

Donation

If you enjoy this plugin, you can thank me and leave a small donation.

Donation

Installation

1. Upload jquery-comment-preview folder to the /wp-content/plugins/ directory.
2. Activate the plugin through the ‘Plugins’ menu in admin interface of WordPress.
3. Play once with the width parameter of #jquery-comment-wrap, #jquery-comment-preview and #comment_preview identifiers (which are in the jquery-comment-preview.css file) to fit the width under your design.
4. If it’s necessary, you can customize options in admin interface at the Options → jQuery Comment Preview page.
5. If it’s necessary, you can edit other CSS styles for comment preview block in the jquery-comment-preview.css file.
6. That’s all.

HTML code of preview block

The plugin creates the following structure of HTML code for the preview block (this may be useful in the design through CSS):

<div id="jquery-comment-wrap">
  <div id="jquery-comment-preview">
    <div id="html-editor">
      <a>button</a>
      <a>button</a>
      ...
    </div>
    <div id="preview-tab">Preview</div>
  </div>
  <textarea name="comment"></textarea>
</div>

If nothing works

1. Make sure that you use the appropriate version of WordPress, which is required for a plugin work.

2. Make sure that the header.php file of your theme has the following code:

   <?php wp_head(); ?>

   If not, insert it before the </head> tag.

3. If the first 2 points are not solved the problem, give details in comments to this post.

Version history