What are the best options for Rich Text Editing in Rails?

Question

I\'d like to use Rich Text Editing in place on forms in order to let admins change instructions. What are the best options for doing this?

[To be more clear - the

Answer 1

For Tumblon, we started with TinyMCE but we are switching to Yahoo's Rich Text Editor because there were some weird issues with the way TinyMCE worked and because the Rich Text Editor documentation and default look-and-feel is superior.

Both are pretty easy to integrate with Rails (they are just JavaScript, after all). There are plugins, but you don't really need one.

Answer 2

I know this threat is pretty old but I came across looking for a few good options the a few weeks back, so in case someone else is facing the same issue like I did I give a more resent response. So my favourite editor is Froala (wysiwyg-editor if you are using rails)which looks clean, is easy to handle and supports embedded videos, picture upload, file upload and is fully customisable to a point where you can even make it simple for backend users without any knowledge of responsive developing to place the items correctly on the page to make them fully responsive. We have used this editor for a number projects now and clients love it.

The documentation is satisfying but it could be better if you are using it with frameworks such as Rails and Django (as we do). But I think it is improving on a monthly basis.

Another very promising editor is Quill (quill-rails if you are using rails). We haven't used it for projects yet but experimenting. Once we have more experience we are going to post a few notes on here and SSC.

Lastly, if you would like to do or offer responsive front-end editing you might want to take a look at x-editable. Check out the demo - it is pretty neat !

Answer 3

Since Rails 6 the Trix editor is natively supported in Rails.

You can use simple rich_text_area form helpers and has_rich_text in your model.

Rails guide here: https://edgeguides.rubyonrails.org/action_text_overview.html

Answer 4

There are a number of templating languages implemented for Rails that give relatively simple syntax for markup. I've used RedCloth before, a gem implementation of Textile (http://redcloth.org/), and it's quite good. Things like Liquid (http://www.liquidmarkup.org/) are a little more powerful, allowing templates to actually include database information inline. Depending on your project's needs, both would potentially be a good fit.

Neither of these solutions alone would give an in-place rich text editor, but are a good starting place on the backend for what might be a drop-in solution. If you're only letting admins enter information though, I'd imagine they wouldn't be frightened of a little plaintext entry.

Answer 5

I'm not sure if I fully understand the question, but if you just ask about which editor to use, there are many options and none of them is a matter of Rails - you can use any of them just by adding a little piece of javascript into your markup. Nice and up to date overview can be found here: http://bulletproofbox.com/web-based-rich-text-editors-compared/.

Answer 6

I've gone through similar struggles in the past, and had settled on YUI. Unfortunately, YUI results (at least for me, and admittedly, I rushed through and never re-factored), in awful html.

Then tonight, when I stumbled on this post, I found PunyMCE. There are 2 awesome things about it: 1) its incredibly lightweight (as its name implies), and 2) there is a rails plugin that has already been created for it: puny_mce on github.

The documentation is good enough, except for a couple of things that I overlooked/had me scratching my head:

1. There is a typo under "Usage", <% yield :head %> should be <%= yield :head %>
2. If you want to use more than the basic toolbar, you need to include either a) the pre-setup profile or b) the toolbar items and required plugins for those items in BOTH the include_puny_mce call AND the puny_mce call. This makes sense -- the include_puny_mce is instructing the page on which javascripts it needs, and the puny_mce call is actually building the javascript output required to generate the rich editor.

Here is an example I put together to demonstrate:

<% content_for :head do %>
  <%= include_puny_mce :profiles => [:full] %>
<% end %>

<h1>New post</h1>

<% form_for(@post) do |f| %>
 <%= f.error_messages %>
 <%= f.label :title, "Title" %><br />
 <%= f.text_field :title %><br />
 <%= f.label :content, "Post Content" %><br />
 <%= f.text_area :content, :cols => 100 %>
 <%= puny_mce 'post_content', 'post_content', :profile => :full %>
 <p>
     <%= f.submit 'Create' %>
 </p>
<% end %>

I hope this helps!