How to Add Comment Previews To Your WordPress Site Using jQuery
Adding a preview function to the comment section of your WordPress blog allows your readers to double check what they’re written before they actually post it.
A lot of folk might instinctively call this a useless feature, but I beg to differ. These are a few of the ways that comment previews can help to keep your WordPress blog a cleaner and happier place:
- Very handy for writing HTML and code examples in a comment. The author can see whether their code is going to render properly, or look like a horrible twisted mess, BEFORE they hit the ‘reply’ button.
- Saves your commenters’ precious time. A live preview will generally allow them to get it right the first time, avoiding the frustration of deleting their own comments and rewriting them two or three times.
- Reduces the risk of pointless, idiotic flame wars. People might reconsider a hastily-written comment, if they can see a preview of their ranting before they release it to the world.
So how’s it done?
For the purposes of this tutorial, we’re using a little plugin called jQuery Comment Preview (tested on WordPress 3.3.1). This puppy adds a ‘preview’ button to the comment section of your WordPress site, and it’s powered by . . . you guessed it, jQuery.
There are a few other plugins that you could use to achieve a similar effect on your site – have a poke around in the WordPress Plugin Directory if you’re looking for something different.
jQuery Comment Preview in action
This is very straightforward stuff. Just install and activate the plugin, and it should work straight out of the box. On my test WordPress site with the Twenty Eleven theme, I now have a little ‘preview’ button in the top right corner of my comment box.
Now I’ve written a comment with some code and formatting in it . . .
Before I post, I can hit the ‘preview’ button to make sure everything renders properly and I don’t sound like an ass.
And that’s all there is to it. A clean, simple way of letting your blog readers proof their own comments before they get posted. The plugin also offers some design customization options, which can be accessed in the ‘settings’ panel of your WordPress dashboard.
FREE EBOOK
Your step-by-step roadmap to a profitable web dev business. From landing more clients to scaling like crazy.
FREE EBOOK
Plan, build, and launch your next WP site without a hitch. Our checklist makes the process easy and repeatable.
Have you used this plugin, or something similar, on your own WordPress site? What’s your opinion? Do previews help people make better comments? Leave a comment below and share your thoughts.
Photo: mag3737.
Tags: