Devigner blog about development and design

Tiny MCE Living in Your Rails Forms

UPDATE: NOVEMBER 20TH, 2007 – There is now a tinymce plugin for rails. How to get it and install it can be found on the rails wiki.

UPDATED: This narrative has been updated.

There’s alot of discussions about how to integrate Fckeditor into your rails app, but what about TinyMCE? I prefer Tiny over FCK because Tiny encloses carriage returns with paragraph tags where FCK uses line breaks. I think it keeps things simple and when there is a person who’s not too knowledgeable about html (most clients), it helps keep them inline.

So, here’s how I integrate TinyMCE into my rails app. It’s much simpler than the FCK route.

1. Download TinyMCE from http://tinymce.moxiecode.com/download.php.
2. Extract the TinyMCE folder into your public/javascripts folder.
3. In your view, place the following script into your head tag.

<%= javascript_include_tag "tiny_mce/tiny_mce" %>

4. Add this javascript to your view.
&lt;script type="text/javascript" ><br /> &#xA0;&#xA0;tinyMCE.init({<br /> &#xA0;&#xA0;&#xA0;&#xA0;mode:"textareas", editor_selector : "tiny_mce"<br /> &#xA0;&#xA0;});<br /> &lt;/script>

5. In your form view, or wherever your form lives. Call the editor with the following snippet. In my case, I’m using it in a scaffold generated form and the text field is named ‘copy’.

&lt;%= text_area 'pages', 'copy' , :cols => "60", :rows => "20",<br /> &#xA0;&#xA0;&#xA0;&#xA0;:class => 'tiny_mce' %>

I hope someone finds this useful. In the future, i’ll be trying to integrate the filemanager and imagemanager plugins into my rails app.