What WYSIWYG works well with jQuery and Ruby on Rails 3.1 (Sprockets)?

I am having trouble making any "common" WYSIWYG work with Rails. We even had to do one ourselves with RedCloth for the moment.

I tried to use tinymce-rails but couldn't make it w开发者_如何学编程ork. Also tried nicEdit which worked but only when you called the online library (and also looks abandoned).

Has anyone worked with a good WYSIWYG that is jQuery and Rails 3.1 (Sprockets) friendly?

---

I use ckeditor in my Rails 3.1 app.

Just throw the folder into you lib/assets/javascripts and whenever you need it reference it like this:

= javascript_include_tag "ckeditor/ckeditor.js"

And in javascript:

:javascript
  $(function(){
    CKEDITOR.replace( 'input',
      {
        // Optional params:
        skin : 'office2003',
        height: '700px'
      });
  })

---

After struggling with this issue for quite awhile, I came up with a solution for using the standard tinyMCE with Rails 3.1 and the asset pipeline.

1. I started with the tinyMCE jQuery package.
2. Create a directory in vendor for tinyMCE: /vendor/assets/javascripts/tiny_mce
3. Place only jquery.tinymce.js inside of /vendor/assets/javascripts/tiny_mce
4. Place the remaining tinyMCE files in a directory in your /public/javascripts folder, inside of a directory called tiny_mce

5. Add tinyMCE to your application.js like so:

   //=require jquery
   ...
   //=require tiny_mce/jquery.tinymce.js
   

6. I initialize tinyMCE in my application.js as well, and set a script_url path to tell tinyMCE that it's supporting files now live in my public/javascripts/tiny_mce directory:

   $('.tinymce').each(function(i){
   $(this).tinymce({
     script_url : '/javascripts/tiny_mce/tiny_mce.js',
      ...
   

That should work. Now you are using the asset pipeline to load tinyMCE, and serving the supporting assets and javascripts from the public directory.

---

The Mercury Editor looks promising. I'm planning to try it on my next rails project.

http://jejacks0n.github.com/mercury/

---

Try MarkitUp

http://markitup.jaysalvat.com/home/

---

Luuf already mentioned Aloha-Editor. Though it's still under heavy development it looks quite promising.

Just put a aloha-config.js file anywhere in your asset path, the aloha-files goes to (i.e.) vendor/assets.

Example config:

    (function(window, undefined) {
        if (window.Aloha === undefined || window.Aloha === null) {
        var Aloha = window.Aloha = {};
            }

    Aloha.settings = {
      logLevels: {'error': true, 'warn': true, 'info': true, 'debug': false,    'deprecated': true},
      baseUrl: "/assets/lib",
      errorhandling: false,
      plugins: false
    };
    })(window);

The line "baseUrl" is most important. Setting it to /assets/lib seems to ensure compability with the asset pipeline.

Haven't tried concatenation yet, will post a comment when I know how it behaves.

Regards!

---

Aloha Editor

http://aloha-editor.org/

It's tough between that & Mercery - but Aloha has a nicer "feel" and it has wider browser support.