I’ve been using the FCKEditor rich text editor that can be implemented directly through Coldfusion 8 for some time now, but recently felt it was time to update. FCKEditor has now become CKEditor and appears to have made some pretty cool improvements.  I haven’t really had a chance to dive into the new editor, but thought I’d post a quick getting started kind of thing.  So the first step is, of course, downloading the plugin and copying it into your root folder, or wherever on your server.

Once you’ve got a copy, create a link to it in your header.  In the following example that I give I use jQuery  just because it makes my life ten times easier, but CKEditor is not a jQuery plugin and does not require it to run.  The easiest way to implement the editor is to create a standard HTML textarea and replace it with the rich text editor.  Before continuing to some code you can check out what the code will be creating here.

The HTML

Convert to Rich Text Editor?<span id="convertyes" class="textClick"> Yes</span>&nbsp;<span id="convertno" class="textClick"> No</span><br /><br />
<textarea name="myeditor">This is default text!</textarea><br /><br />
<span id="getvalue" class="textClick">Get Value</span>

We have just a couple things here.  Most important is the textarea with the name ‘myeditor’.  This is the textarea that we will convert to the rich text editor.  Otherwise, are just a couple functionality buttons.  First are a couple ‘yes’/'no’ buttons for converting the textarea to the editor and removing the editor.  And below the textarea is a button that allows us to get the value entered into the rich text area for further processing.

So let’s take a look at the javascript.

(more…)