Seek a jQuery-based inplace HTML editor


I just stepped over to
lots and lots of choices – and if to judge by the dates, many new
offerings. I'm hoping someone can help me narrow down the field
according to these priorities…

  • Stability & Well-formed XHTML (might argue against some of the most recent unless they are revisions with a clear track-record)
  • Inplace editing
  • Good AJAX integration
  • For internal / admin / CMS usage so it can be as bloated as it needs to be long as it's easy to implement the basics:
    • bold
    • italics
    • indents
    • lists

No need for tables but dropdowns that show relevent CSS selectors would be nice.


Best Solution

I know that you are looking for a jquery based rich text editor. But the one i will be suggesting is based on prototype. Its called WYSIHAT, an open-source project by 37signals team. You can say that it is a framework for WYSIWYG editors. Why would you choose that? Simple, Easy customization, Well formed XHTML and ofcourse Good AJAX Integration. You have loads of other rich text editors but all are not easily customizable. I say so coz of the fact that you will have major trouble changing the "widget" set provided by the editor to something of your liking. And if there is bad code anywhere then it is a PITA to rectify it coz of the poor standards of coding by the developer.

Since you really don't care about the bulkiness i doubt using prototype along with jquery would be a big hassle. It would be a bad option to use both if it was not for internal/ admin/ CMS use. But since your main aim is "simplicity", WYSIHAT comes to your rescue. It provides you with a foundation on which you can build your self-woven rich text editor.


37Signals: Introducing WYSIHAT. An eventually better open-source WYSIWYG Editor.

If you are developing the CMS in Ruby-on-Rails then you are in for a treat:

A WYSIHAT Rails engine:

WYSIHat tutorials:

Setting up WysiHAT. A Tutorial. Part 1:

Setting up WysiHAT. A Tutorial. Part 2:

An advanced toolbar for WysiHat:

Here is the API documentation:

By the way.. The WYSIHat js file after minifying is just 6kb. 1000 times lesser than TinyMCE.