繁体   English   中英

将自定义工具栏添加到rails中的CKEditor

[英]Add custom tool bar to CKEditor in rails

我正在使用CKEditor和CKEditor gem( https://github.com/galetahub/ckeditor )并且一切正常,直到我尝试添加自定义工具栏。

我见过的一些帖子建议使用config.js文件。 但是,根据说明进行设置, app/assets/javascripts没有/ckeditor/config.js文件。 此外,如果我将/ckeditor/config.js添加到javascripts目录,则文件上载功能将停止工作。 即使config.js是空文件,也会发生这种情况。 通过重新启动服务器,“上载”选项卡将变为隐藏且无法正常运行。

有没有办法可以普遍定制工具栏? 或者即使我可以将选项内联或有用的东西配对......

使用Rails 3.2.11

在我的Gemfile中我有:

gem "jquery-rails", "~> 2.2.1"
gem "ckeditor"
gem "carrierwave"
gem "mini_magick"
gem "cloudinary"

在application.rb我有:

config.autoload_paths += %W(#{config.root}/app/models/ckeditor)

在application.js我有:

//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require ckeditor/init
//= require_tree ../../../vendor/assets/javascripts/.
//= require_tree .

在我的表格中,我有:

= f.cktext_area :content

我尝试使用的config.js文件:

CKEDITOR.editorConfig = function( config ) {
  config.toolbar_Custom = [
    { name: 'document',    items : [ 'Source','-','Save','NewPage','DocProps','Preview','-','Templates' ] },
    { name: 'clipboard',   items : [ 'PasteFromWord','-','Undo','Redo' ] },
    { name: 'insert',      items : [ 'Image','Table','HorizontalRule','SpecialChar','PageBreak' ] },
    { name: 'tools',       items : [ 'Maximize', 'ShowBlocks','-','About' ] },
    '/',
    { name: 'basicstyles', items : [ 'Bold','Italic','Underline','Strike','Subscript','Superscript','-','RemoveFormat' ] },
    { name: 'paragraph',   items : [ 'NumberedList','BulletedList','-','Outdent','Indent','-','Blockquote','-','JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock','-','BidiLtr','BidiRtl' ] },
    { name: 'links',       items : [ 'Link','Unlink','Anchor' ] },
    '/',
    { name: 'styles',      items : [ 'Styles','Format','Font','FontSize' ] },
    { name: 'colors',      items : [ 'TextColor','BGColor' ] }
  ];

  config.toolbar = 'Custom';
};

您必须手动创建自己的config.js文件。 要保留“上载”选项卡,请在ckeditor gem repo上关注此问题,该解释说明如何解决此问题:

https://github.com/galetahub/ckeditor/issues/238

只需将filebrowser的引用配置javascript粘贴到config.js文件中,上传选项卡将返回完整功能。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM