Замените изображения панели инструментов CKEditor значками font awesome

#ckeditor #font-awesome

#ckeditor #шрифт-awesome

Вопрос:

Есть ли какой-нибудь способ заменить изображения панели инструментов по умолчанию (например, жирный шрифт, курсив и т. Д.) На значки Font Awesome?

Ответ №1:

Я знаю, что это старая проблема, но на основе плагина за плагином я смог добавить значки font-awesome к кнопкам ckeditor со следующим кодом внутри функции плагина init . В моем случае мой плагин вызывался trim :

 //Set the button name and fontawesome icon
var button_name = 'trim';
var icon = 'fa-scissors';

//When a ckeditor with this plugin in it is created, find the button
//in the current instance and add the fontawesome icon
CKEDITOR.on("instanceReady", function(event) {
  var this_instance = document.getElementById(event.editor.id   '_toolbox');
  var this_button = this_instance.querySelector('.cke_button__'   button_name   '_icon');
  if(typeof this_button != 'undefined') {
    this_button.innerHTML = '<i class="fa '   icon   '" style="font: normal normal normal 14px/1 FontAwesome !important;"></i>';
  }
});
  

Это зависит от знания класса диапазона внутри кнопки, поэтому это может быть не самым удобным, но это работает.

Ответ №2:

Лучше всего, если вы можете использовать тему Bootstrap в CKEditor или использовать редактор Froala, в нем есть встроенный загрузчик изображений

Комментарии:

1. Речь идет не о загрузке изображения, а о замене значков панели инструментов на значки Awesome.