Ckeditor

https://github.com/galetahub/ckeditor

ckeditor是一款嵌入网页的富文本编辑器，是一种所见即所得的编辑器，就是你编辑的时候看见的样式，就是将来显示的样式。

自带了常见的文本编辑功能。

 

功能

整合rails3.2

支持文件文件浏览

HTML5的文件上传

 

 

安装

下面的安装过程适用于ruby1.9.3+rails3.2.8.

 

打开Gemfile，加入

 
  
  1. gem 'ckeditor', '3.7.3' 
 
  
执行下面的命令安装gem。
 
  
 
  
  1. bundle install  
 
  
文件上传需要配合paperclip。
 
  
在Gemfile中加入
 
  
 
  
  1. gem 'paperclip', '~> 3.0' 
 
  
再次执行bundle install，或者在paperclip的项目首页查看具体的安装过程。
 
  
执行
 
  
 
  
  1. rails generate ckeditor:install --orm=active_record --backend=paperclip 
 
  
在config/applicaiton.rb中加入
 
  
 
  
  1. config.autoload_paths += %W(#{config.root}/app/models/ckeditor) 
 
  
在config/routes.rb中加入
 
  
 
  
  1. mount Ckeditor::Engine => '/ckeditor' 
 
  
上面这句也可能已经添加好了，如果没有，就自行添加即可。
 
  
在config/environments/production.rb中加入
 
  
 
  
  1. config.assets.precompile += ['ckeditor/*'] 
 
  
然后执行
 
  
 
  
  1. rake assets:precompile 
 
  
查看public/assets/ckeditor目录是否存在，里面是否生成cs文件和js文件。
 
  
在app/views/layouts/application.html.erb或者是你的模板文件中的head部分加入
 
  
 
  
  1. <%= javascript_include_tag "ckeditor/ckeditor" %> 
 
  
保证你的网页中生成的javascript引用为
 
  
 
  
  1. <script type="text/javascript" src="/assets/ckeditor/ckeditor-a985aea0d2afea8d57038a46fd5e5e05.js"> 
 
  
在view页面中加入
 
  
 
  
  1. <div class="field"> 
  2.     <%= f.label :content %><br/> 
  3.     <%= f.cktext_area :content, :toolbar => 'Full', :width => 800, :height => 400 %> 
  4.   </div> 
 
  
现在打开你的网页，你会发现富文本编辑器已经起作用了。
 
  
 
  
 
 
  
你把控件的内容保存起来，将来显示用，但是显示的时候要需要注意一点。因为保存的是带有html标记的文本，不是纯文本，不能直接显示，否则显示的内容中就会包含大量的html标签。
 
  
要用下面的方式显示带有html标签的文本，这样才可以看到想要的效果。
 
  
 
  
  1. <p> 
  2.   <b>Content:</b> 
  3.   <%= raw @post.content %> 
  4. </p> 
 
  
要在显示内容前面加上一个raw。