CODEWITHSUNDEEP
ruby-on-railsrubytinymcerails-admin
tubbo
tubbo

Reputation: 608

Is it possible to use tinyMCE with rails_admin?

I really like rails_admin, but my clients don't like CKEditor. Is this really the only option for WYSIWYG on this gem? Is there any way to use tinyMCE with rails_admin?

Upvotes: 5

Views: 2639

Answers (4)

ecoologic
ecoologic

Reputation: 10420

I achieved this in a slightly different way, which worked for:

  • rails_admin (0.8.1)
  • tinymce-rails (4.4.1)

Implementation:

Gemfile

gem 'tinymce-rails'

app/assets/javascripts/rails_admin/custom/ui.js

//= require tinymce-jquery

var admin = {
  initTinyMce: function() { tinyMCE.init({ selector: "textarea[name$='_html]'" }) }
}

$(function() {
  admin.initTinyMce();

  $(document).on('rails_admin.dom_ready', function() {
    admin.initTinyMce();
  });
});

Explanation

https://github.com/sferik/rails_admin/wiki/Theming-and-customization

  • Suggests the ui.js location
  • Suggests to use rails_admin.dom_ready

https://github.com/spohlenz/tinymce-rails

  • //= require tinymce-jquery: no ruby interpolation required and I like using manifest files

Custom:

  • I needed to run the initialization twice, all seems good so far
  • The selector textarea[name$='_html]' will convert all text areas where the field ends in _html, that's what I store, that's how I name my fields

Upvotes: 0

Dynamick
Dynamick

Reputation: 546

Great andistuder, I propose a modified version of your solution.

Copy the rails_admin.js.erb from the gem to the /assets/javascripts/rails_admin/ in your project path. Add the following line:

...
require_asset 'tinymce-jquery'
%>
jQuery(function() {
     jQuery('textarea').tinymce({
       theme: 'advanced'
     });
});

And all will works like a charm!

Upvotes: 1

andistuder
andistuder

Reputation: 506

after struggling to get CKEditor working properly in RailsAdmin (on Rails 3.1), I used tinymce: It works well and is done in minutes:

in your gemfile add: 

gem 'tinymce-rails'

plus you inlcude a line in rails_admin.js.erb:

require_asset 'tinymce-jquery'

you may need to copy the whole file (rails_admin.js.erb) from the gem to /assets/javascripts/rails_admin/ before you do this.

finally, you will also need to add some jquery to the view files
app/views/rails_admin/main/edit.html.haml and app/views/rails_admin/main/new.html.haml 

 :javascript 
   jQuery(function() { 
     jQuery('textarea').tinymce({ 
       theme: 'advanced' 
     }); 
   });

This will add the Wysiwyg to all text area fields.

Upvotes: 5

Jason Yost
Jason Yost

Reputation: 4937

WYSIWYG editors typically just overlay an HTML text area element with JavaScript functionality. So any editor should work in theory. You could replace the references in the code to tinyMCE, make sure you have all the files properly installed and then set tinyMCE to use the ID of the text area control.

It should not make a difference to the back-end programming which client side interface is used to create HTML in the text area.

Upvotes: 1

Related Questions