editor for TEXTAREA's in the website back end.

I am building a small CMS for my website using PHP. I have some textarea's where I would like to have something like CKEditor. I have tried to add a few to my textarea's but I couldn't seem to do it. I am looking for a free one if possible. Thanks in advance.
Who is Participating?
Ray PaseurCommented:
No points for this, please.  TinyMCE is free, but takes a little configuration.  I've used it in several sites and IIRC it is the editor WordPress uses.
RNBAuthor Commented:
Any tips on configuration before I dive in?
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

Ray PaseurCommented:
Yes, just one.  Don't waste your time trying to have more than one TinyMCE TEXTAREA on the same page.  Design your app so that will never be needed!
Agreed - and for how to configure - when you download tinymce, either the normal JS, or the jquery version, there is an "example" folder that contains a working example html file (run from a local webserver to see) - you can simply look at the source to see how it works - in general, all the "tinymce magic" is in the headers of the html file, so you will need that in your page as well obviously, and the crux is to basically simply ensure that your textarea is of the correct class as per below:

<textarea id="elm1" name="elm1" rows="15" cols="80" style="width: 80%" class="tinymce">
      This is some example text

You do however also need to make sure that the tinymce files are copied to your webserver as well into the paths that are being called by the page, eg, <script type="text/javascript" src="../jscripts/tiny_mce/jquery.tinymce.js"></script>
Beverley PortlockCommented:
Ray said: "Yes, just one.  Don't waste your time trying to have more than one TinyMCE TEXTAREA on the same page.  Design your app so that will never be needed!"

Why? It is not THAT hard. Just add mode : 'textareas' and it should do all of them. To stop a textarea being used give it this class in the tag editor_deselector : "mceNoEditor"

<!-- tiny editor
     tinyMCE.init({   mode : 'textareas',
                      theme: 'advanced',
                      plugins: 'table,media',
                      theme_advanced_buttons1 : 'pasteword,bold,italic,justifyleft,justifycenter,justifyright,justifyfull,bullist,numlist,outdent,indent,separator,link,unlink,code,removeformat,formatselect',
                      theme_advanced_buttons2 : 'tablecontrols,media,image',
                      theme_advanced_buttons3 : '',
                      theme_advanced_blockformats : 'h1,h2,h3,h4,pre',
                      force_br_newlines : false,
                      content_css: './gembizMce.css',
                      extended_valid_elements: 'object[classid|codebase|width|height|align|type|data|style],param[id|name|type|value|valuetype<DATA?OBJECT?REF],embed[quality|type|pluginspage|width|height|src|align],iframe[align<bottom?left?middle?right?top|class|frameborder|height|id|longdesc|marginheight|marginwidth|name|scrolling<auto?no?yes|src|style|title|width],script[type|language|src]',
			  	  editor_deselector : "mceNoEditor"
// -->

Open in new window

greetings RNB, all of the javascript text editors like tinymce can be useful for a see what you get editor. however they all take some time to learn (usually not alot of time), but you will do well to EXPERIMENT, take time to read the instructions for the OPTIONS, and then try several of the OPTIONS, and see what difference it makes, remember, to experiment in javascript you do not have to load these on the server, just use them on your computer first.
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.