jQuery WYSIWYG Editors - jwysiwyg is my pony

Posted 15 Years Ago

FCKEditor, You're so Big

For the last year or two I've been using FCKEditor for my custom content management systems.  It does what it needs to do and does it better than any other WYSIWYG editor I've seen.  For newbies out there, a WYSIWYG Editor is a 'What You See Is What You Get' editor.  It allows users to create HTML content without having to know any HTML.  In fact, this blog post right now is being written with the use of the FCKEditor WYSIWYG.

Anyway, there are a few things I don't like about FCKEditor.

• Speed - It takes a rather long time to load on the page.
• Installation - It's really easy to install it after you've done it once or twice, but uploading the thousands of files you need is a bit cumbersome.
• Plugins - To be fair I havne't tried very hard to create a plugin for it, but it seems like there's a bit of a learning curve for writing the plugins.
• Touchy - The Unorder List I'm typing here is giving me all sorts of trouble.  I can deal with it, most clients get driven crazy by it.

The jQuery Alternatives

So, the other day I looked around for something better, specifically a jQuery WYSIWYG because that's my soup d'jour.  I discovered there are basically two editors out there:

1. WYMeditor - Doesn't advertise itself as jQuery, but I'm pretty sure it is.  However, it confuses me.  I don't get why it shows me 'p' tags, etc.

2. jWSIWYG Editor - Apparently based off the WYMEditor, but much better in my opinion.  Super small size, efficient, pretty, does basic things very well.  However, it's not very robust and the documentation is non-existant.

...oh, wait, just found a third:

3. HTMLBox- Only just found this.  Looks like it's more robust than the others, but kind of ugly.  I'll have to play around with it more.

jWYSIWYG Is My Pony

So far I'm putting my money on jWYSIWYG. It's already a staple of my code base and I'm very happy with it.  It's perfect for basic editing (forum posts, comments, about me, etc.) and at only 4KB it's the smallest WYSIWYG editor I've ever seen.  Plus, it seems to do things so much better.  It responds quickly to your actions and does what you want it to do. 

Of course, the reason it's does things so nicely right now is because it doesn't do much.  Here's a full list of features:

• Bold
• Italic
• Strike Through
• Underline
• Jstify Left
• Justify Center
• Justify Right
• Justify Full
• Indent
• Outdent
• Subscript
• Superscript
• Undo
• Redo
• Insert Ordered List
• Insert Unordered List
• Insert Horizontal Rule
• H1
• H2
• H3
• H4
• H5
• H6
• Cut
• Copy
• Paste
• Increase Font Size
• Decrease Font Size
• Create Link -

  Dialog box pops up with field for the link URL

• Insert Image -

  Dialog box pops up with a field for the Image URL

• Html -

  A view of the HTML Source code for the WYSIWYG Editor

• Remove Format

Looking at it now, it's a pretty good list and--as I said--it works perfectly well for most small text formatting.  Indeed, as developers we often want to restrict what users have the ability to do.  But, there are some key things missing; some things which are required if it's ever going to be capable of being integrated into a Content Management System

• Image Uploading
• Tables
• Flash 
• Text Color
• Font Family
• CSS Styles

Alright, well that's all I can think of at the moment, but I'm sure there's more things it needs.  Anyway, the point is I'm going to be playing around with it in the next few weeks, starting with the 'Image Uploading' capability.  I'll let you know what I come up with.