January 22, 2006

Live Preview Comments

Here's something I ripped off from Ace of Spades HQ... it is the live preview feature for comments.

I recently added this feature to this site, where it is located above the comment box, and to Bad Example, where it is locate under the comment box.

This code works in MT. I don't see any MT specific code in it, so it should work in Word Press or anything else for that matter. If you try it out, please leave a comment to the effect that it works or not. Thanks!

First, insert this code into your head section of your Comment Listing Template and/or Individual Entry Archive:

<!-- script type="text/javascript" language="javascript">
function ReloadTextDiv()
var NewText = document.getElementById("DynamicText").value;
NewText = NewText.replace(/\n/g, '<br />');
var DivElement = document.getElementById("TextDisplay");
DivElement.innerHTML = NewText;

Next, insert this code into the body section of that same template where you want the live preview function to appear:

<div class="comments-head">
Live Comment Preview

<div class="comments-body">
<span id="TextDisplay">
<div class="comments-head">Post a comment

I also commented out the preview comment button in the code:
<!--<input type="submit" name="preview" value=" Preview " /> -->

Posted by Madfish Willie at January 22, 2006 07:38 PM | TrackBack

Added to the sidebar under Useful Thingies.

Posted by Madfish Willie at January 21, 2006 07:48 PM

Does anyone want the code the the numbering of the comments... see my blog for a sample or look at the comments here!

Posted by Madfish Willie at January 21, 2006 07:49 PM

I think that the live comment preview doesn't strip out markup that MT strips out, for example underline.

Posted by David Boxenhorn at January 22, 2006 10:00 AM

Hey! It kept the underline! In my blog it gets stripped out. How did you do that?

Posted by David Boxenhorn at January 22, 2006 10:01 AM

It's a setting in your blog configuration file. It will determine which HTML to allow in the comments.

General Settings
Under 'Sanitize Specs'
Select 'Use My Settings' radiio button
Insert this line:
a href,i,b,u,strike,sup,sub,blockquote,br,p

These codes will enable the following HTML to be used in the comments:
Link, Italics, Bold, Underline, Stike, Sup, Sub,

Line Break,


Posted by Madfish Willie at January 22, 2006 06:08 PM

I guess MuNuviana doesn't allow the blockquote tag in the actual comment. However, it did display correctly in the Live Preview box. I wonder if someone with access can change that for us?

Posted by Madfish Willie at January 22, 2006 06:12 PM

What about "overline"---does that work in combination with "underline" too?

Posted by kyer at January 22, 2006 10:56 PM

Anything that is valid HTML should work in the comments as long as you put it in the My Settings list as shown above.

Posted by Madfish Willie at January 23, 2006 01:42 AM

Okay Willie, I used the javascript above on my blog (http://www.ericsgrumbles.net/) and got .......... nothing. It looks just like the source for MuNuviana. It's a pretty straightforward script, so confusion has set in!

Posted by Eric at February 5, 2006 02:05 AM
Live Comment Preview
Post a comment

Remember personal info?