CKEditor is a ready-for-use HTML text editor designed to simplify web content creation. It’s a WYSIWYG editor that brings common word processor features directly to your web pages. Enhance your website experience with our community maintained editor. ckeditor.com/
-
Ckeditor version 4.1 (full)
-
Rails 3.2 integration
-
Files browser
-
HTML5 files uploader
-
Hooks for formtastic and simple_form forms generators
<
8000
/ul>
For basic usage just include ckeditor gem:
gem "ckeditor"
For files uploading support you need generage models for file storage. Currently supported next backends:
-
ActiveRecord (paperclip, carrierwave, dragonfly)
-
Mongoid (paperclip, carrierwave, dragonfly)
For active_record orm is used paperclip gem (it’s by default).
gem "paperclip" rails generate ckeditor:install --orm=active_record --backend=paperclip
gem "carrierwave" gem "mini_magick" rails generate ckeditor:install --orm=active_record --backend=carrierwave
gem 'mongoid-paperclip', :require => 'mongoid_paperclip' rails generate ckeditor:install --orm=mongoid --backend=paperclip
gem "carrierwave-mongoid", :require => 'carrierwave/mongoid' gem "mini_magick" rails generate ckeditor:install --orm=mongoid --backend=carrierwave
All ckeditor models will be generated into app/models/ckeditor folder. Autoload ckeditor models folder (application.rb):
config.autoload_paths += %W(#{config.root}/app/models/ckeditor)
Mount engine in your routes (config/routes.rb):
mount Ckeditor::Engine => "/ckeditor"
Include ckeditor javascripts rails 3.2 (application.js):
//= require ckeditor/init
Form helpers:
<%= form_for @page do |form| -%>
...
<%= form.cktext_area :notes, :class => "someclass", :ckeditor => {:language => "uk"} %>
...
<%= form.cktext_area :content, :value => "Default value", :id => "sometext" %>
...
<%= cktext_area :page, :info, :ckeditor => {:uiColor => "#AADC6E", :toolbar => "mini"} %>
...
<% end -%>
All ckeditor 4.0 options here docs.ckeditor.com/#!/api/CKEDITOR.config
In order to configure the ckeditor default options, create files:
app/assets/javascripts/ckeditor/config.js app/assets/javascripts/ckeditor/contents.css
jQuery sample:
<script type='text/javascript' charset='UTF-8'>
$(document).ready(function(){
$('form[data-remote]').bind("ajax:before", function(){
for (instance in CKEDITOR.instances){
CKEDITOR.instances[instance].updateElement();
}
});
});
</script>
<%= form.input :content, :as => :ckeditor %>
<%= form.input :content, :as => :ckeditor, :input_html => { :ckeditor => { :height => 400 } } %>
<%= form.input :content, :as => :ckeditor, :input_html => { :ckeditor => {:toolbar => 'Full'} } %>
To use cancan with Ckeditor, add this to an initializer.
# in config/initializers/ckeditor.rb Ckeditor.setup do |config| config.authorize_with :cancan end
At this point, all authorization will fail and no one will be able to access the filebrowser pages. To grant access, add this to Ability#initialize
# Always performed can :access, :ckeditor # needed to access Ckeditor filebrowser # Performed checks for actions: can [:read, :create, :destroy], Ckeditor::Picture can [:read, :create, :destroy], Ckeditor::AttachmentFile
en:
ckeditor:
page_title: "CKEditor Files Manager"
confirm_delete: "Delete file?"
buttons:
cancel: "Cancel"
upload: "Upload"
delete: "Delete"
rake test rake test CKEDITOR_ORM=mongoid rake test CKEDITOR_BACKEND=carrierwave rake test:controllers rake test:generators rake test:integration rake test:models
This project rocks and uses MIT-LICENSE.