Dải CKEditor <i> Thẻ

Question

Tôi đang cố gắng tìm giải pháp để tránh CKEditor, nhưng cả FCKeditor cũ cũng loại bỏ bất kỳ thẻ <i> nào từ nội dung được chèn trước đó vào db.

Trường hợp:

tôi chèn nội dung html vào db, một số nội dung chứa <i> yếu tố. Tôi làm điều này với CKEditor. Mọi thứ hoạt động hoàn hảo và nội dung hiển thị trên trang web. Nhưng khi tôi muốn chỉnh sửa nội dung được chèn trước đó, các thành phần <i> bị thiếu.

Trong trường hợp cụ thể của tôi sử dụng:

<i class="fa-icon-fullscreen fa-icon-xxlarge main-color"></i> 

Tất nhiên nếu tôi vô hiệu hóa các biên tập viên, các nội dung hiển thị tốt trong textarea.

Answer 1

Tôi tìm thấy giải pháp cho vấn đề cụ thể này tôi chạy vào với <i> thẻ

Câu trả lời ban đầu tôi đã nhận từ drupal forum

Việc sửa chữa hoặc tinh chỉnh (bạn tên nó) cho nó là thiết lập sau vào config.js ckeditors:

// ALLOW <i></i> 
config.protectedSource.push(/<i[^>]*><\/i>/g); 

Nhờ Spasticd onkey để chỉ tôi tới liên kết.

Answer 2

Có hai vấn đề có thể:

• Đọc về Advanced Content Filter. CKEditor đang loại bỏ các phần tử không được phép, nhưng bạn có thể mở rộng các quy tắc của bộ lọc.

• Tuy nhiên, nếu vấn đề là CKEditor loại bỏ các phần tử rỗng <i>, thì bạn cần tìm cách khác để sử dụng nó. CKEditor không phải là nhà xây dựng trang web WYSIWYG. Nó là một trình soạn thảo tài liệu, do đó nội dung được tải phải có ý nghĩa. Phần tử nội tuyến rỗng không có bất kỳ ý nghĩa nào, do đó nó bị loại bỏ, bởi vì nếu không trình soạn thảo sẽ không biết phải làm gì với nó.

  Một trong các giải pháp có thể có trong tương lai (gần) sẽ là sử dụng Widgets system, để xử lý các phần tử trống đó. Nhưng bây giờ tôi khuyên bạn nên kiểm tra CKEDITOR.htmlDataProcessor và short guide cách sử dụng nó.

Answer 3

cho 4.3 phiên bản ckeditor

trong cấu hình.js (sau phần config) dán

CKEDITOR.dtd.$removeEmpty['b'] = false; 

và viết phụ tùng với mã

CKEDITOR.plugins.add('bwcaret', { 
requires: ['widget'/*, 'richcombo'*/], 

icons: 'bwcaret', 

init: function(editor) { 

    editor.widgets.add('bwcaret', { 

     button: 'Create a caret', 

     template: '<b class="caret"></b>', 


     allowedContent: 'b(!caret)', 

     requiredContent: 'b(!caret)', 

     upcast: function(element) { 
      return element.name == 'b' && element.hasClass('caret'); 
     }, 

    }); 
} 

});

Answer 4

Khi giải pháp protectedSource được sử dụng, i thẻ không còn bị tước, nhưng img thẻ ngừng hiển thị trong chế độ WYSIWIG của CKEditor (Tôi đang sử dụng 4.3.1). Các giải pháp mà làm việc tốt hơn cho tôi là để vô hiệu hóa loại bỏ trống i thẻ sử dụng CKEDITOR.dtd.$removeEmpty

Ví dụ, tôi được thêm vào sau vào config.js

// allow i tags to be empty (for font awesome) 
CKEDITOR.dtd.$removeEmpty['i'] = false; 

Lưu ý: Điều này nên được đặt bên ngoài CKEDITOR.editorConfig = function(config) chức năng .

Answer 5

Đây là những gì làm việc cho tôi

thêm 3 dòng mã dưới đây theo thứ tự trong hồ sơ cá nhân ckeditor drupal thiết admin/config/content/ckeditor/chỉnh sửa/Full

ADVANCED OPTIONS> > tùy chỉnh cấu hình JavaScript

config.allowedContent = true; 
 
    config.extraAllowedContent = 'p(*)[*]{*};div(*)[*]{*};li(*)[*]{*};ul(*)[*]{*}'; 
 
    CKEDITOR.dtd.$removeEmpty.i = 0;

Dòng đầu tiên tắt khá nhiều bộ lọc nâng cao

Dòng thứ hai cho phép TẤT CẢ lớp (), bất kỳ kiểu {} và bất kỳ thuộc tính nào [*] cho p, div, li và ul.

Dòng cuối cùng dành cho thẻ trống ... dòng này hoạt động với hình ảnh ... Tôi thấy rằng nếu bạn sử dụng config.protectedSource.push (/] *> </i>/g); nó loại bỏ thẻ trong khi chỉnh sửa.