Tôi đang sử dụng CKEditor với đá quý CKEditor (https://github.com/galetahub/ckeditor) và mọi thứ hoạt động chính xác, cho đến khi tôi cố gắng thêm thanh công cụ tùy chỉnh.Thêm thanh công cụ tùy chỉnh vào CKEditor trong đường ray
Một số bài đăng tôi đã thấy đề xuất sử dụng tệp config.js. Tuy nhiên, với cài đặt theo hướng dẫn, không có tệp /ckeditor/config.js
trong app/assets/javascripts
. Ngoài ra, nếu tôi thêm /ckeditor/config.js
vào thư mục javascripts, chức năng tải lên tệp sẽ ngừng hoạt động. Điều này xảy ra ngay cả khi config.js
là một tệp trống. Tab "Tải lên" bị ẩn và không hoạt động với khởi động lại máy chủ.
Có cách nào tôi có thể tùy chỉnh toàn bộ thanh công cụ không? Hoặc thậm chí nếu tôi chỉ có thể ghép nối xuống các tùy chọn inline hoặc cái gì đó sẽ rất hữu ích ...
Sử dụng Rails 3.2.11
Trong Gemfile của tôi, tôi có:
gem "jquery-rails", "~> 2.2.1"
gem "ckeditor"
gem "carrierwave"
gem "mini_magick"
gem "cloudinary"
Trong application.rb tôi có:
config.autoload_paths += %W(#{config.root}/app/models/ckeditor)
Trong ứng dụng. js tôi có:
//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require ckeditor/init
//= require_tree ../../../vendor/assets/javascripts/.
//= require_tree .
Ở dạng của tôi, tôi có:
= f.cktext_area :content
config.js nộp Tôi cố gắng sử dụng:
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';
};