Link to home
Start Free TrialLog in
Avatar of RNB
RNB

asked on

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.
ASKER CERTIFIED SOLUTION
Avatar of psimation
psimation
Flag of South Africa image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
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.
Avatar of RNB
RNB

ASKER

Any tips on configuration before I dive in?
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
</textarea>

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>
Avatar of Beverley Portlock
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.