美文网首页
ckeditor 安装 实现上传图片 插入附件

ckeditor 安装 实现上传图片 插入附件

作者: bigbug_ | 来源:发表于2017-07-21 10:34 被阅读0次

    一 安装ckeditor

    1 gemfile中增加 gem 'ckeditor'

    2 编辑app/assets/javascripts/admin.js  增加 //= require ckeditor/init

    3 编辑app/views/admin/events/_form.html.erb

    <%= f.cktext_area :description, ckeditor: { language: 'zh-CN'} %>

    如果用simple_form的话,可以用f.input :description, as: :ckeditor

    4 编辑config/initializers/assets.rb

    Rails.application.config.assets.precompile += %w( admin.css admin.js ckeditor/* )

    5 如果觉得默认的工具列(toolbar)太复杂,可以改用 mini toolbar 配置:

    app/views/admin/events/_form.html.erb

    -  <%= f.cktext_area :description, ckeditor: { language: 'zh-CN'} %>+  <%= f.cktext_area :description, ckeditor: { toolbar: 'mini', language: 'zh-CN'} %>

    二 ckeditor中html中增加图片

    1、

    gem 'carrierwave'

    gem 'mini_magick'

    rails generate ckeditor:install --orm=active_record --backend=carrierwave

    bundle install

    rake db:migrate

    2 就是说在 /lib/tasks目录下创建个新的文件ckeditor.rake,在该文件中添加下面代码:

    lib/tasks/ckeditor.rake

    require 'fileutils'

    desc "Create nondigest versions of all ckeditor digest assets"

    task "assets:precompile" do

    fingerprint = /-[0-9a-f]{32}./

    for file in Dir["public/assets/ckeditor/*/"]

    next unless file =~ fingerprint

    nondigest = file.sub fingerprint, '.'

    FileUtils.cp file, nondigest, verbose: true

    end

    end

    3、

    class Ckeditor::Picture < Ckeditor::Asset

    def self.inheritance_column

    nil

    end

    end

    4、You need to set with true the following variable in the file config/enviroments/production.rb

    config.assets.compile = true

    and add the following code

    config.assets.precompile += Ckeditor.assets

    config.assets.precompile += %w(ckeditor/* )

    config.autoload_paths += %W(/app/models/ckeditor)

    5 上传图片还是失败

    执行 bundle update ckeditor,重启服务器,

    不能上传,一直转

    不能上传一致转...

    6

    git commit后,回退到上一个commit,但是某些文件没有删除,public下的

    git reset --hard HEAD~1

    7 参考https://richonrails.com/articles/getting-started-with-ckeditor

    使用paperclip

    gem"paperclip"

    rails generate ckeditor:install--orm=active_record--backend=papercliprake db:migrate

    再执行 rake db:migrate

    提示relation"ckeditor_assets" already exists

    表在上一步中创建了,没有删除干净,所以提示错误,在数据库pg管理界面直接删除(git reset 回滚不能回滚数据库)

    再执行 rake db:migrate,成功

    8 用paperclip还是一样错误,回退 git reset

    还用carr..

    9 最后的最后,用了一个真正的图片传上去了.....!!!!...!!

    测试服务器通过了

    10 正式部署

    执行RAILS_ENV="production" rake db:migrate

    在重启nginx,成功!!!

    三 插入附件

    ckeditor本身就有这个功能

    点“插入/编辑超链接”,再点“上传”选项卡,选文件后点“上传到服务器上”,然后在超链接信息中写上 链接名称

    相关问题:

    1 上传1.7mb的图片受限制,一直转,不能上传

    修改nginx限制 在/opt/nginx/conf/nginx.conf中修改配置文件,在使用的 server 配置中加上一条命令

    client_max_body_size 50m;  

    上传大小上限为50m

    2 更改编辑框大小

    在config.js的CKEDITOR.editorConfig = function(config)中设置config.height = 400;

    很多属性都是在这里设置

    生产环境要重启nginx

    注意:更改后在火狐浏览器上不生效,清除火狐缓存好了(不用重启浏览器)

    3 拖拽添加图片问题

    图片可以直接拖进去,但浏览时不能显示,


    相关文章

      网友评论

          本文标题:ckeditor 安装 实现上传图片 插入附件

          本文链接:https://www.haomeiwen.com/subject/vkyfcxtx.html