jQuery Comment Preview WordPress Plugin

Description

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

Requires WordPress version: 2.5 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 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Since version 0.1.5 plugin have a new template of a HTML editor buttons. Therefore when upgrading the plugin from earlier version to 0.1.5 or higher it is necessary to do following:

  • If you have changed the default preview block template, save it somewhere on your computer.
  • Click the “Reset Defaults” button at the bottom of the plugin options page.
  • Now you can again setup an options if you needed.

If not reset the plugin’s options, it may not work.

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

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

jQuery Comment Preview WordPress Plugin

Version: 0.1.6 | Total downloads: 5454 | Last updated: 2010-01-05

Donation

If you enjoy this plugin, you can thank me and leave a small 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 comments.php file of your theme has the following code:

    <?php do_action('comment_form', $post->ID); ?>

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

  3. If the first 2 points are not solved the problem, give details in comments to this post.
  4. Plugin “jQuery Comment Preview” may not work if you have installed the plugin OpenID.

Version history

  • Version 0.1.6 (01.05.10):
    • solved the problem, when a tags have been inserted incorrectly in Internet Explorer when using the HTML editor;
    • adding a link now works like in WordPress HTML editor – when ‘link’ button is clicked, there appear a window for entering a URL.
  • Version 0.1.5 (12.20.09):
    • the design of preview panel has been changed. Now it looks like WordPress HTML editor;
    • the structure of the template of the HTML editor has been changed;
    • the script connects now to the name parameter of the textarea tag, but not to id;
    • solved the problem, when in some cases preview did not work;
    • the plugin’s JS and CSS files connects now in the head section of the page code;
    • jQuery now comes from Google.
  • Version 0.1.4 (06.20.09): added ability to indicate the value of the id attribute of the textarea tag; added ability to insert comment date and time in preview block template; added the option for displaying avatars from gravatar.com.
  • Version 0.1.3 (02.07.09): fine-tuned filters of text formatting in preview; deleted automatic fitting the width of the preview panel under width of a <textarea> field, now need to change its width through CSS, for this you need to play once with the width parameter of #jquery-comment-wrap and #jquery-comment-preview identifiers, which are in the jquery-comment-preview.css file.
  • Version 0.1.2 (12.19.08): the changes associated with incorrect display of the comment form in Internet Explorer on some WordPress themes.
  • Version 0.1.1 (12.17.08): fixed bug: the comment can not be submited.
  • Version 0.1 (12.16.08): the initial version.

63 Responses to “jQuery Comment Preview WordPress Plugin”

  1. GodKid, sure does.

  2. Does it work

  3. it’s a test to see your plugin ;)

Leave a Reply

Hot Tubs