In CKEditor 4 zum Ändern der Editorhöhe gab es eine Konfigurationsoption: config.height .
Wie ändere ich die Höhe von CKEditor 5? (der klassische Editor)
Beantworte meine eigene Frage, da sie anderen helfen könnte.
CKEditor 5 enthält keine Konfigurationseinstellungen mehr, um seine Höhe zu ändern. Die Höhe kann einfach mit CSS gesteuert werden.
Es gibt jedoch eine knifflige Sache, wenn Sie den Classic Editor verwenden:
%Vor% %Vor% Dann wird der klassische Editor das ursprüngliche Element (mit der ID editor1
) verstecken und daneben rendern. Deshalb funktioniert die Änderung der Höhe von #editor1
über CSS nicht.
Die vereinfachte HTML-Struktur sieht nach dem Rendern von CKEditor 5 (dem klassischen Editor) wie folgt aus:
%Vor% In Wirklichkeit ist HTML viel komplexer, weil die gesamte CKEditor-Benutzeroberfläche gerendert wird. Das wichtigste Element ist jedoch der "Bearbeitungsbereich" (oder "Editierkasten"), der mit einer ck-editor__editable
-Klasse markiert ist:
Der "Bearbeitungsbereich" ist das weiße Rechteck, in das man den Text eingeben kann. Um die Höhe des Bearbeitungsbereichs zu stylen / ändern, reicht es aus, das editierbare Element mit CSS anzusteuern:
%Vor%