使用 ckeditor-rails rails 中带有 CKEditor 的自定义工具栏

Custom toolbar with CKEditor in rails with ckeditor-rails

我正在使用 ckeditor-rails gem 将 CKEditor 与 rails 集成。我还使用 http://ckeditor.com/builder 来生成工具栏,但是我想通过删除一些来自定义更多。这是构建器的配置

/**
 * @license Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved.
 * For licensing, see LICENSE.md or http://ckeditor.com/license
 */

CKEDITOR.editorConfig = function( config ) {
 
 // %REMOVE_START%
 // The configuration options below are needed when running CKEditor from source files.
 config.plugins = 'dialogui,dialog,about,a11yhelp,basicstyles,blockquote,clipboard,panel,floatpanel,menu,contextmenu,resize,button,toolbar,elementspath,enterkey,entities,popup,filebrowser,floatingspace,listblock,richcombo,format,horizontalrule,htmlwriter,wysiwygarea,image,indent,indentlist,fakeobjects,link,list,magicline,maximize,pastetext,pastefromword,removeformat,showborders,sourcearea,specialchar,menubutton,scayt,stylescombo,tab,table,tabletools,undo,wsc';
 config.skin = 'moono';
 // %REMOVE_END%

 // Define changes to default configuration here.
 // For complete reference see:
 // http://docs.ckeditor.com/#!/api/CKEDITOR.config

 // The toolbar groups arrangement, optimized for two toolbar rows.
 config.toolbarGroups = [
  { name: 'clipboard',   groups: [ 'clipboard', 'undo' ] },
  { name: 'editing',     groups: [ 'find', 'selection', 'spellchecker' ] },
  { name: 'links' },
  { name: 'insert' },
  { name: 'forms' },
  { name: 'tools' },
  { name: 'document',    groups: [ 'mode', 'document', 'doctools' ] },
  { name: 'others' },
  '/',
  { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
  { name: 'paragraph',   groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] },
  { name: 'styles' },
  { name: 'colors' },
  { name: 'about' }
 ];

 // Remove some buttons provided by the standard plugins, which are
 // not needed in the Standard(s) toolbar.
 config.removeButtons = 'Underline,Subscript,Superscript';

 // Set the most common block elements.
 config.format_tags = 'p;h1;h2;h3;pre';

 // Simplify the dialog windows.
 config.removeDialogTabs = 'image:advanced;link:advanced';
};

从上面的代码中我了解到可以通过

删除工具栏上的按钮

config.removeButtons = 'Underline,Subscript,Superscript';
现在我想删除图像,插入水平线并从工具栏插入特殊字符。

    config.removeButtons = 'Underline,Subscript,Superscript,Image,Insert Horizontal Line, Insert Special Character';

它适用于图像按钮,但不适用于其他 2 个按钮。

我在哪里可以获得表示要删除的按钮的值(在我的例子中是 水平线 特殊字符 按钮?我认为它必须在我找不到的 CKEditor 网站某处提及。

非常感谢您的帮助。

ps:ckeditor-rails 在内部使用 jquery ckeditor。

如果您使用 CKBuilder 生成您的 CKEditor 版本,删除提供您不打算使用的按钮的插件更有意义 - 否则您仍然会毫无理由地加载这些插件,这使得在性能方面意义不大。另见 4 Common CKEditor Installation Mistakes And How To Avoid Them

如果出于某种原因您仍然坚持只删除配置中的按钮,请检查 Toolbar Configurator。它是一个旨在帮助您调整特定编辑器包的工具栏的工具 - 您可以在 samples/index.html 文件中找到它。它可以让您轻松找到按钮的名称("Advanced" 版本)或者更好的是,通过选择可用按钮("Basic" 版本)实时调整工具栏。