jcedit: A jQuery Plugin for contenteditable containers

Hi Guys,

Here is a skeleton jQuery plugin that you can use on various pages to get people to send you corrections on the web pages of yours. Let me explain a bit more.

So this plugin was written to help me with my work with a WordPress plugin of mine that allows in article editing and correction suggestion to be sent to the author/administrator. The WordPress plugin is called WP Errata and will be available from WordPress.org

But lets talk about this little jQuery plugin and I will take you though some key things that this plugin does.

Example markup

So the above markup is something that we will need. It doesn’t matter if you include contenteditable=”true” or not, as long as you are including class=”jcedit” or your own within the div element, see the usage section

Usage

This plugin allow hook functions when user resets or hit save button and these actions can be overridden by following functions

As you can see that by default the functions will have old and new content available through params.

So a quick usage example will be

 

.jcedit is the default class that we have applied jcedit to but you can have your own hook classes. It shouldn’t matter.

There is a good Stack print when you pass on debug: true some maybe useful info is printed out.

Styling

Here is the default stylesheet that you can edit if you are not happy with default styles.

Above is pretty much very simple styles definitions that can be edited with ease

 

 

Version

Current version 1.0

Demo

Ok here is a quick demo of this plugin

http://jaspreetchahal.org/examples/jquery-examples/jcedit/jcedit.html

If you have any question regarding this demo please let me know

Compatibility

This plugin should work if contenteditable is supported by your browser. This plugins has been tested on latest version for the following browsers including IE9 and IE10

 

Donations

If you like this Plugin, please consider donating

You can choose your own amount. Developing plugin like these toke a lot of effort and time; days and weeks of continuous voluntary unpaid work.
If you like this plugin or if you are using it for commercial websites, please consider a donation to the author to
help support future updates and development.

        Main uses of Donations

  1. Web Hosting Fees
  2. Cable Internet Fees
  3. Time/Value Reimbursement
  4. Motivation for Continuous Improvements

 


Download source

Source can be downloaded from Google Code and here is the link

http://code.google.com/p/jcedit/

I hope this helps

Cheers

 

 

Comments

  1. sell this plugin on codecanyon.net!

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.