Life is easier with TinyMCE

As you all probably know I work as a System Administrator on a company that has a newspaper. Several months ago somebody asked something like: “When will we have on the web a system to put bold, italic and colours inside the articles?” I knew there were libraries and plugins to do that, but until today  I din’t have the time to make such experiments… However, the day has arrived..

After “webing” a little I found a couple of “wysiwyg html editor” to put inside an HTML/PHP document, but nothing that made me say “WOWWW!!” until I found TinyMCE… yes, I said “WOOW!” but not because it’s great but because it’s tiny!!! Yes, as its own name says this little, tiny, ridiculous library permits yourself to convert an HTML TextArea on a fully wordprocessor… What do you need? JavaScript!! Nothing more.. so let’s activate some “boxes” with editors inside…

First of all, go to www.tinymce.com and download the package. As you can see there are several versions, even one which works fine using JQuery over it, but this is not the case. Upack the archive and upload the content of the tinymce directory inside your web folder. After that create an html document and put this inside it…

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "https://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="https://www.w3.org/1999/xhtml" dir="ltr"> <head> <title>TinyMCE Test</title> <meta http-equiv="content-type" content="text/html; charset=utf-8"/>  <script type="text/javascript" src="tiny_mce/tiny_mce.js"> </script>  <script type="text/javascript">  tinyMCE.init({         mode : "textareas" });  </script> </head> <body>     <textarea name="content" cols="50" rows="15">This will be inside your box.</textarea&gt </body>  </html> 

Go to your browser and point where your document is saved and… yes! you’ll see a wonderfull “textarea box” where you can put your text in bold style and many things more…