How To Add text editor(TinyMCE) in your web application

Hi,
     There are several open source editor available to use in your web application but i prefer to use TinyMCE editor because of it's simple to use and it has many features.
TinyMCE is a platform independent web based Javascript HTML WYSIWYG editor control released as Open Source under LGPL.
TinyMCE has the ability to convert HTML TEXTAREA fields or other HTML elements to editor instances.
In this post we are going to learn ho to use tinyMCE into your web application in JSP

Step 1 : Download TinyMCE editor from http://www.tinymce.com/download/download.php into your local drive.

Step 2 : Unzip and Add tinymce folder to your project root or in WebContent directory.

Step 3:  Add text area to JSP e.g. <textarea id="elm1" name="message">

Step 4: Add following  to your JSP to call tinymce editor :

<script type="text/javascript" src="tinymce/js/tinymce/tinymce.js"></script>

Step 5: Now as per your requirement add tiny mce script which will convert text area into editor:

e.g.:  tinymce
.init({
selector : "textarea",
theme : "modern",
width : 200,
height : 100,
});

By default tinymce converts all the textarea into text editor, if you like to change only specific textarea into text editor then specify it as given below
tinymce
.init({
selector : "textarea#elm1",
theme : "modern",
width : 200,
height : 100,
});
Here selector : textarea#elm1 , will only convert elm1 text area into editor and not the other text areas in your jsp page.

That's all , it's done. Now run your application to use text editor :-)