Excellent WYSIWYG HTML editor (all platforms)

20 April 2007, 18:29, by Jon

I have been trying out several HTML editors for ASP.Net and thought I would share this excellent find that works with several platforms, including ASP.Net, ASP, PHP, Java etc. Up until now I was using FreeTextBox, however this was giving me grief in Firefox so decided that I needed to find a new solution.

FCKeditor is an excellent HTML WYSIWYG editor for ASP.Net as an ASP.Net control is available to use with the Javascript source files to allow you to interact (Get / Set text) etc programmatic ally as you can do with FreeTextBox. In addition to this, FCKEditor allows you to upload images and other files making adding images a breeze and also includes a spell-checker.

Using FCKEditor is also a piece of cake. Simply download FCKEditor and extract the fckeditor directory, placing it the root of your ASP.Net application.

In addition to this, to use the ASP.Net control you need to ensure that the FredCK. FCKEditorV2.dll file is in your bin directory, you can then either add it to your tool bar, and drag-n-drop the control in, or add the following page directive to your ASPX page:

<%@ Register Assembly="FredCK.FCKeditorV2" Namespace="FredCK.FCKeditorV2" TagPrefix="FCKeditorV2" %>;

And then add the following control:

<fckeditorv2:fckeditor id="FCKeditor1" runat="server" height="500px" skinpath="skins/office2003/" toolbarset="Pilot" customconfigurationspath="/fckeditor/fckconfig.js">
</fckeditorv2:fckeditor>

FCKEditor is highly configurable as it is opensource and you can very easily edit the fckconfig.js file to create a new custom toolbar. If you do this, you will need to specify the ToolbarSet property and also add the CustomConfigurationPath properties to your control. The FCKEditor also comes with 3 skins: default, office2003 and silver (a silver version of office 2003). These can be set using the SkinPath configuration above.

As the fckeditor javascript directory is generic for 9 languages, it needs trimming down before deploying live. There is a readme.txt supplied with the download, but basically it involves deleting the server-side code to handle the file-uploads for the languages you are not using and also deleting the skin files you are not using.

Finally if you want to be able to upload files, you need to create a directory in the root of you application called UserFiles. When the user inserts an image from a local file, it is uploaded to this directory.

FCKEditor is a feature rich, cross-browser compatible (Safari will also shortly be supported) WYSIWYG HTML Editor for ASP.Net which is highly configurable and easy to use.



5 comments below:


Have you looked at the HTML component for Flex where they embed FCKeditor in to a flash application?

It fixes the Flex RTE lack of feature issue but I wonder how good it works.

Comment by Dave Finnerty — 19 January 2008 @ 22:08

I’m having a Flex 2 app with AMFPHP and MySQL written and need a WYSIWYG text editor. I showed the FCKeditor to my developer and he said it would not be a good solution for Flex since it uses JavaScript.

Can you confirm if that’s true? I keep feeling they want to steer me towards developing something from scratch and I’d prefer to have something pre-developed.

I appreciate any advice you can provide.

Sincerely,
Chuck

Comment by Chuck Frazier — 29 January 2008 @ 18:51

Hi Chuck,

It is true FCKEditor is great for HTML based web applications but to use with flex you would have to make calls from Flex to JavaScript using External Interface or the new Flex Javascript Bridge which can work fine, but might not be ideal. Have a look at this http://www.judahfrangipane.com/blog/?p=132

Jon

Comment by Jon — 29 January 2008 @ 19:02

Plz help
How can you configure for the image upload problem

Comment by EvilInside — 18 March 2008 @ 12:10

Hi there, just to say I came across this site as I was tryinig to do just what your article describes, and was a bit clueless about how to do it. I’m going to try it as soon as I’ve finished uploading files. I wanted to find a way to disable the font colour change, so as to have a consistant style throughout my site. Things are always simpler than they seem! Nice site btw!

Douglas

Comment by Douglas — 26 January 2009 @ 14:44

Leave a comment

About Jon

Jon started his career hacking code on his Sinclair Spectrum before moving on to more sophisticated machines ( ...such as a Commodore 64 ). He graduated from the University of Kent in 2000 with a degree in Computer Science and since then has worked in finance and education before co-founding Go Tripod. He is passionate about usability and design and his favourite development technologies are Ruby, and Objective-C/Cocoa. When he is not sat at his desk he is standing on his head doing yoga, refining his taste for food or on an adventure exploring the great outdoors.

Go Tripod Ltd

Go Tripod Ltd is a UK-based development company working with some of the most exciting software technologies around. Simon Ashley, Jon Baker and Colin Ramsay are the brains behind projects such as Stubmatic, and are developing bespoke web, mobile and desktop software for clients with household names. We believe in good service as well as good software, and we’re eager to work with people who feel the same.