Genii Weblog

Who's wagging whom? Part 2

Wed 19 Apr 2006, 11:10 AM

by Ben Langhinrichs
As I wrote about in my earlier post Who's wagging whom?, FCKeditor may be a great editor, but it has a few quirks that have forced us to change CoexEdit in ways I wouldn't have though necessary.  Along with the alignment issue identified there, there is an even more annoying issue with the use of font tags instead of CSS styles.  If I have three words sized and colored as below with CSS:

10 pt blue 14 pt green 18 pt pink

which has the HTML code of:

<span style="font-size: 10pt; color: blue; ">10 pt blue </span><span style="font-size: 14pt; color: green">14 pt  green </span><span style="font-size: 18pt; color: pink; ">18 pt pink </span>

and I use FCKeditor, it will display correctly.  If I then highlight all three at once and try to switch to red, the colors won't change visibly, because FCKeditor will simply add the font tag to make:

<font color="#ff0000"><span style="font-size: 10pt; color: blue; ">10 pt blue </span><span style="font-size: 14pt; color: green">14 pt  green </span><span style="font-size: 18pt; color: pink; ">18 pt pink </span></font>

and Internet Explorer will assume correctly that the CSS overrides the font tag.  Grrr!!!  FCKeditor doesn't look for the color styles.  So, we have had to make a change to use font tags, which gives less fine control over the size, but which works with FCKeditor.

Unless somebody knows how to get FCKeditor to pay attention to the CSS?  Anybody?

Copyright 2006 Genii Software Ltd.

What has been said:

452.1. Stan Rogers
(04/19/2006 01:12 PM)

Fixing FCKeditor shouldn't be a huge problem, but I think it might be time to consider mandating an editor (or two) to get control back. For instance, JS will allow one to change various functions in an otherwise "stock" library at runtime, but that kinda counts on you knowing what's there in the first place.

FCKeditor may give a decent UI experience, but if it's using font tags, it's not doing the job programmatically at all. I wouldn't change my code to follow the rabbit down that particular hole. It's the editor that's gotta change, but you can only do that if you either supply the editor or mandate a version/build and supply the patch.

(I hereby offer my services as a MGW to build a patch if you'd like. Well, more of a "I'd rather not have to apply for welfare" -W than one of the money-grubbing variety, really. Good script, Mister Ben. Real cheap. You like, see?)

452.2. Ben Langhinrichs
(04/19/2006 01:17 PM)

You have a point. Actually, it gets even worse. If you modify an image's height and width through the image properties, it changes the html properties for height and width, but if you stretch the image by dragging, it adds style tags for height and width. What is really stupid is that if you drag first and then try to modify through the properties box, the image size doesn't change to match the changes in the properties box. The height and width HTML tags change, but since the height and width style tags do not, the image doesn't change size. So, FCKeditor isn't even consistent with itself. I may have to either hire a MGW or modify FCKeditor myself. Huge sigh!

452.3. Adrian Sutton
(04/19/2006 02:30 PM)

Disclaimer: I work for Ephox so I write a WYSIWYG editor and sell it for a living.

I'd always found FCK's interface fairly clunky and the editing a bit primitive, but I expected its HTML and CSS support to be a lot better than this. Normally I try to avoid the conflict of interest in suggesting people rethink their editor choice, but putting this much effort in and breaking HTML like this to work around bugs in an editor is getting pretty distracting from the actual development of your software.

That said, if you want to stay with a JavaScript-based editor you may not find anything better - they tend to need to do an awful lot of work to clean up these loose ends because the browsers model of the content is designed for rendering and not for editing. It was my impression that FCK was the best of the JavaScript-based editors so you may be stuck with it.

Of course, I know where you can get a great Java-based editor. :) If I remember right you've already done an integration with it too.