Jak skonfigurować okno dialogowe Właściwości obrazu w CKEditorze?

Question

Moje bieżące okno dialogowe Właściwości obrazu ma tylko zakładki Image Info i Link. Chcę zmienić to okno dialogowe, tak aby:

1. Chcę usunąć Szerokość, wysokość, Graniczna, hspace, vSpace, wyrównanie i Podgląd elementy z ekranu Image Info
2. Chcę usunąć kartę Link
3. Chcę włączyć kartę Upload, dzięki czemu użytkownicy mogą wybrać plik obrazu, który znajduje się na komputerze lokalnym

robiłem wiele poszukiwań, ale nie mogę zrozumieć, jak to zrobić powyższe wcale . Jakieś wskazówki, proszę? Używam standardu CKEditor 4.4.6.

Answer 1

Ok, oto kod, w jaki sposób obsłużyć Obraz dialogowe:

CKEDITOR.on('dialogDefinition', function(ev) { 
    var editor = ev.editor; 
    var dialogName = ev.data.name; 
    var dialogDefinition = ev.data.definition; 

    if (dialogName == 'image') { 
     var infoTab = dialogDefinition.getContents('info'); 
     infoTab.remove('txtBorder'); //Remove Element Border From Tab Info 
     infoTab.remove('txtHSpace'); //Remove Element Horizontal Space From Tab Info 
     infoTab.remove('txtVSpace'); //Remove Element Vertical Space From Tab Info 
     infoTab.remove('txtWidth'); //Remove Element Width From Tab Info 
     infoTab.remove('txtHeight'); //Remove Element Height From Tab Info 

     //Remove tab Link 
     dialogDefinition.removeContents('Link'); 
    } 
}); 

Do punktu 3, domyślnie CKEditor nie zawiera instrument przeglądania obrazów ... A to oznacza, że ​​upload i przycisk przeglądania nie pojawi się ...

Dostępne są 3 opcje i możesz zobaczyć mój komentarz na tej stronie: link, w jaki sposób możesz to zrobić.

Answer 2

Poniższe zasoby mogą być pomocne:

• Sekcja Dialog Windows HOWTO w dokumentacji dla programistów CKEditor.
• Próbka Using CKEditor Dialog API (jest również dostępna w lokalnym pakiecie CKEditor) - sprawdź jej kod źródłowy pod kątem zmian.
• Wtyczka Developer Tools, która pokazuje nazwy i identyfikatory wszystkich elementów okna dialogowego CKEditor.