rails ckeditor 安装与使用
rails ckeditor 安装与使用
?
安装
?
首先下载ckeditor插件?https://github.com/galetahub/rails-ckeditor
?
将插件放到vendor目录下,并把JavaScripts下的ckeditor文件夹放到项目public的javascripts下
?
安装成功,这样就能使用了。
?
使用
?
迁移文件 ? 20100731013242_create_assets
?
class CreateAssets < ActiveRecord::Migration def self.up create_table :assets, :options=>"charset=utf8" do |t| t.string :data_file_name t.string :data_content_type t.integer :data_file_size t.integer :assetable_id t.string :assetable_type, :limit=>25 t.string :type, :limit=>25 t.integer :information_id t.string :information_type t.timestamps end add_index "assets", ["assetable_id", "assetable_type", "type"], :name => "ndx_type_assetable"add_index "assets", ["assetable_id", "assetable_type"], :name => "fk_assets" end def self.down drop_table :assets endend?
?
模型文件
?
?
class Asset < ActiveRecord::Base # === List of columns === # id : integer # data_file_name : string # data_content_type : string # data_file_size : integer # assetable_id : integer # assetable_type : string # type : string # locale : integer # user_id : integer # created_at : datetime # updated_at : datetime # ======================= belongs_to :assetable, :polymorphic => true def url(*args) data.url(*args) end alias :public_filename :url def filename data_file_name end def content_type data_content_type end def size data_file_size end def path data.path end def styles data.styles end def format_created_at I18n.l(self.created_at, :format=>"%d.%m.%Y %H:%M") end def to_xml(options = {}) xml = options[:builder] ||= Builder::XmlMarkup.new(:indent => options[:indent]) xml.tag!(self.type.to_s.downcase) do xml.filename{ xml.cdata!(self.filename) } xml.size self.size xml.path{ xml.cdata!(self.url) } xml.styles do self.styles.each do |style| xml.tag!(style.first, self.url(style.first)) end end unless self.styles.empty? end endend
?
?
?
class AttachmentFile < Asset # === List of columns === # id : integer # data_file_name : string # data_content_type : string # data_file_size : integer # assetable_id : integer # assetable_type : string # type : string # locale : integer # user_id : integer # created_at : datetime # updated_at : datetime # ======================= has_attached_file :data, :url => "/assets/attachments/:id/:filename", :path => ":rails_root/public/assets/attachments/:id/:filename" validates_attachment_size :data, :less_than=>10.megabytesend?
?
这些文件用来管理上传图片和文件,将如片的信息,路径存储到assets表里
?
?
迁移数据库即可
?
视图
?
引入ckeditor
?
<script type="text/javascript" src="/javascripts/ckeditor/ckeditor.js"></script>?
?
rails代码
?
<%= f.ckeditor_textarea :admin_news, :content%>
?
?其中 admin_news为对象,content为字段名
?
这样就能用了!
?
工具栏
?
工具栏里的按钮默认按照配置文件config.js里的配置。
可以在一下文件里更改按钮以及位置、增减。
?
?
config.toolbar= [ ['Source','-','Save','NewPage','Preview','-','Templates'], ['Cut','Copy','Paste','PasteText','PasteFromWord','-','Print'], ['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],['Smiley','SpecialChar'], '/', ['Bold','Italic','Underline','Strike','-','Subscript','Superscript'], ['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'], ['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'], ['Link','Unlink'], ['Image','Table','HorizontalRule'], '/', ['Styles','Format','Font','FontSize'], ['TextColor','BGColor'], ['ShowBlocks','ImageButton'], ];
?
?
精简工具栏
?
?
config.toolbar_Basic =[ ['Bold','Italic','Underline','Strike','-','Subscript','Superscript'], ['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'], ['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'], ['Link','Unlink'], '/', ['Styles','Format','Font','FontSize'], ['TextColor','BGColor'], ];
?
?
这样使用精简工具栏
?
?
<%= f.ckeditor_textarea :enterprise, :summary,:toolbar => "Basic"%>
?
?汉化
?
据说是在配置文件里做如下设置:
config.language = 'zh-cn';?
却怎么试都没成功,无奈之下,将lang里zh-cn.js的文件copy到en.js中,并把所有的全删除
?
成功!
?
上传图片
?
插件已经能上传图片,但是图片自动保存都硬盘上,内容里只有一个路径,删除的时候,图片会留在服务器上,因此
要将图片信息保存在另外一张表中。
在assets表里增加新闻id字段,可以存储图片属于哪条新闻,利用正则表达式从内容里抽取出图片的路径存入表中,并把新闻id一并存入。
将一下方法放到create里,save之后
?
def news_picture(string, news_id) regex = /[\/][\d]+[\/]/ string1 = string.scan(regex).to_s regex1 = /[\d]+/ picture = string1.scan(regex1) for i in picture do @picture = Asset.find_by_id(i.to_i) @picture.information_id = news_id @picture.information_type = '新闻' @picture.save end end?
当删除时
#删除图片 def delete_picture(id) @news_picture = Asset.find(:all, :conditions => ["information_id = ? and information_type = ?", id, "新闻"]) unless @news_picture.blank? @news_picture.each do |picture| picture.destroy FileUtils.rmtree("RAILS_ROOT/public/assets/picturs/#{picture.id}/") if File.exists? "RAILS_ROOT/public/assets/picturs/#{picture.id}" end end end?放在destroy方法里,传入id,要先删图片,再删新闻。
?
1 楼 jinleileiking 2010-11-18 嗯,以前搞过,顶一个。 2 楼 ywencn 2010-11-19 以前搞过,现在换kindeditor了, ck在IE下的模样实在惨不忍睹....