To gemify Super Simple WYSIWYG Editor on Bootstrap for Ruby on Rails version >= 3.1
Website of Summernote, https://github.com/hackerwins/summernote
The version of summernote-rails is matched for the summernote editor.
Add the following gems to your application's Gemfile:
# for Rails 4.0 gem 'simple_form', github: 'plataformatec/simple_form', tag: 'v3.0.0.beta1' # for Rails 3.x gem 'simple_form' gem 'bootstrap-sass' gem 'font-awesome-rails' gem 'summernote-rails'
And then execute:
First of all, the summernote editor works on Bootstrap and so it is assumed that you have already set it up.
//= require summernote.min
In app/assets/stylesheets/application.css, you should added the following:
*= require font-awesome *= require summernote
$ -> # to set summernote object # You should change '#post_content' to your textarea input id summer_note = $('#post_content') # to call summernote editor summer_note.summernote # to set options height:300 # to set code for summernote summer_note.code summer_note.val() # to get code for summernote summer_note.closest('form').submit -> # alert $('#post_content').code() summer_note.val summer_note.code() true
In app/views/posts/_form.html.erb, you should add 'summernote' class name to the textarea input as the following:
<%= simple_form_for(@post) do |f| %> <%= f.error_notification %> <div class="form-inputs"> <%= f.input :title %> <%= f.input :content, class:'summernote' %> </div> <div class="form-actions"> <%= f.button :submit %> </div> <% end %>
- Fork it
- Create your feature branch (
git checkout -b my-new-feature)
- Commit your changes (
git commit -am 'Add some feature')
- Push to the branch (
git push origin my-new-feature)
- Create new Pull Request