Javascript 将自定义工具栏添加到rails中的编辑器

我将CKEditor与CKEditor gem（）一起使用，在我尝试添加自定义工具栏之前，一切都正常工作

我看到的一些帖子建议使用config.js文件。但是，按照说明进行设置时，

app/assets/javascripts

中没有

/ckeditor/config.js

文件。此外，如果我将

/ckeditor/config.js

添加到javascripts目录，文件上传功能将停止工作。即使

config.js

是空文件，也会发生这种情况。服务器重新启动后，“上载”选项卡将隐藏且不起作用

有没有一种方法可以让我自定义工具栏？或者，即使我可以将选项内联配对，或者做一些有帮助的事情

使用Rails 3.2.11

在我的文件中，我有：

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

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

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

= f.cktext_area :content

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';
};

在application.rb中我有：

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

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

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

= f.cktext_area :content

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';
};

在application.js中我有：

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

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

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

= f.cktext_area :content

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';
};

在我的表格中，我有：

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

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

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

= f.cktext_area :content

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文件：

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

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

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

= f.cktext_area :content

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上的此问题，其中说明了如何解决此问题：

只需将filebrowser的引用配置javascript粘贴到config.js文件中，Upload选项卡就会返回完整的功能