FCKEditor problems with Firefox 3.6
When I went to upload photos to my photography website this afternoon I noticed that the FCKEditor that I use in my site was no longer displaying but instead a basic textarea was shown. For those not familiar with FCKEditor it is a rich text editor plugin that allows for a WYSIWYG html editor in websites. As I just installed Firefox 3.6 the day before, I determined that there must be some type of conflict so I headed off to google to see what the deal was.
Immediately, I came across a post from Pete Freitag explaining the issues of the "Year 2010" bug. It appears that certain versions of the ColdFusion FCKEditor use a regular expression that only searches for years up to 2009 when searching for Gecko version date.
The regular expresion is in line 47 of fckutils.cfm in the root of the fckeditor installation folder:
As I started to make the change on my site, I decided instead, to go and grab the latest version of CKEditor, version 3.1. I have used the 3.0.1 version on other projects and have never taken the time to upgrade my photo site to use the newer tool. Changing over to the new version was quick and easy. Here are the steps I had to take to replace my old FCKEditor with the new CKEditor 3.1.
1. Download CKEditor 3.1 and unzip to the root of my project. At this time I also removed the FCKEditor directory but first made sure that I replaced all instances of the FCKEditor before doing so.
2. Open the templates that contain the previous FCKEditor instance.
3. Add the path to load the ckeditor in the head of the template like so:
4.Find the cfmodule tags that called the previous FCKEditor and replace them with a text area and the following script:
CKEDITOR.replace( 'editor1' );
</script>
In my example, I wanted to use the "basic" toolbar and make the editor match my page color so I added the following to the script above:
CKEDITOR.replace( 'postblurb', {
toolbar : 'Basic',
uiColor : '#999999'
} );
</script>
Full documentation is available for the CKEditor here.
Comments
Hi Steve, I'm just using the default code plugin right now as well and totally agree with you about the conflicts with the editor. Right now, I use noscript in Firefox and disable javascript and add my code blocks as a final step. Not the best solution in my opinion, but until I can find something better that is what I am doing. In the future I want to take a look at http://coldfish.riaforge.org/">ColdFish
as it looks really nice.
Oh yeah ColdFish looks great! I've noticed it's integration with Ray's BlogCFC I've been meaning to get the time to have a look at implementing ColdFish as a Mango plugin... one day maybe :) I do the same JS disabling in FireFox too, seems like the only way I've heard of getting around this issue - really should be in the plugin details/instructions when you download and install the plugin. Anyways, cheers thanks for the info.
Hey a little off topic, but what plugin are you using for Code Snippet display blocks (CF, CSS, HTML, etc.). The plugins available that I have tried have beena little tricky at times and have conflicted with the editor every now and then unless I switch Javascript off in my browser when editing a post containing code block snippets. Cheers.