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