CKEditor - CSS für Text und ImageManager

[Ron]

Hallo Forum,
ich habe eine (vermutlich) einfache Frage zum CKEditor "Texteditor + Bild (CKEditor Lite)".
Die aktuellste Version des AddOns (CKEditor 2.6.0) habe ich installiert.

Wie kann ich denn den Text, den man dort eingeben kann in der CSS-Datei ansprechen.
Die mitgelieferte CSS-Infos beziehen sich nur auf das Bild (Float left / Float right).
Der Text wir als normaler conten p ausgegeben.
Wie muss ich die Classe benennen, um den Text individuell sytelen zu können?

Und weiß jemand, wie man auf alle Filter des ImageManagers zugreifen kann?
Bei mir wird aktuell nur 1 Eintrag zur Auswahl im Dropdown angezeigt.

Wenn mir einer einen Tipp geben kann, hier schon mal vielen Dank dafür.

[RexDude]

1. ähh:

p {
font-size: 50px;
}

???

2. Schau doch mal in die Moduleingabe

[RexDude]

Übrigens: beim Modul unter CKEditor Addon > Module > Image Modul stehen ein paar Hinweise dabei. Da wird deine Frage auch schon beantwortet.

[Ron]

Hallo RexDude,
habe das Problem zwischenzeitlich gelöst.

Ein Frage bzw. Anregung hätte ich zum CKEditor-Modul:
Könnte man es einrichten, dass nicht nur das Bild, welches man zusätzlich mit dem "CKeditor Image Modul " hinzufügen kann, mit einem ImageManager-Filter modifiziert werden kann, soinderm auch ein normales Bild innerhalb des Hauptfensters bzw. des normalen HTML-Codes, der dortverzeugt wird. Der Grund ist, dass man auch dort (vor allem auch im normalen CKEditor Standard) gelegentlich ein Bild irgendwo im Text hinzufügen möchte. Klar kann man das Bild über Breite/Höhe beeinflussen, aber geladen wir dann erst das Ursprungsbild, die Verkleinerung findet aber erst im Browser statt. Daher müsste man das Bild schon im Medienpool verkleinert anlegen, umd den unnötigen Datentransfer zu vermeiden. Aber genau dafür ist ja der (super) ImagaManager gedacht, um exakt diese Arbeitsschritte vermeiden zu könne - aber wm erzähle ich das .
Es wäre toll, wenn man beim normalen Bild ebenfalls einen IM-Filter zuweisen könnte.
Vielleicht läßt sich das ja irgendwann mal mit einbauen?!
Da wären sicher viele Redaxo-Anwender dankbar dafür.

[RexDude]

IM Bild im Text kann man mit dem Image Modul auch machen in dem man einfach 2 Blöcke macht.

[Ron]

Ja klar, das könnte man machen. Dann kann ich aber auch ein anderes Bildmodul verwenden, bei dem ich noch weiter fleixible Möglichekiten wie zusätzlich Bildunterschriften etc. gleich mitnutzen kann. Das ziel des Gedanken war es aber, nich noch mehr Blöcke unnötigerweie einbuen zu müssen und es dem Redakteur so einfach und ünerschaubar wie möglich zu machen. Aber kein Problem, da findet sich eine Lösung. Trotzdem Danke für die schnelle Rückmeldung.

[Ron]

IM Bild im Text kann man mit dem Image Modul auch machen in dem man einfach 2 Blöcke macht.

Hallo RexDude,
jetzt hab ich doch noch eine Frage:
Wenn ich einen ganz normalen Textblock habe und irgendwo dazwischen gerne ein Bild setzen möchte, sodaß der Text um das Bild fließt d.h. oben rechts und unten rum, dann kann ich es mit den 2 Blöcken ja nicht erreichen, da dann das Zusatzbild entweder darüber oder darunter sitzt, egal ob links- oder rechtsfloatend.
Um das zu erreichen, muss ich ja dann doch das "normale" Bild des Editorfensters verwenden, und da kann ich wie bereits erwähnt aber leider keine ImageManager-Filter verwenden.
Hast du mir noch einenTipp, wie ich "Textblock it umfließendem Bild + IM-Filter", wie von dir empfohlen, mit 2 Blöcken eventuell doch realisieren könnte?

Vielen Dank schon mal für einen Tipp

[RexDude]

Hi Ron,

habs noch nicht ganz verstanden. 1 Block "Text" dann 1 Block "Text + Bild" geht nicht (als Beispiel) ?

[Ron]

Hi Ron,

habs noch nicht ganz verstanden. 1 Block "Text" dann 1 Block "Text + Bild" geht nicht (als Beispiel) ?

Hi RexDude,
ich würde das Bild gerne links oder rechts vom tet reinsetzen, aber in der Höhe eben nicht entweder ganz oben oder ganz unten sondern irgendwo dazwischen.
Hier eine Skizze
(--- = Text, BILD = Bild/ soll natürlich nur 1 Bild mit Höhe über mehrere Zeilen darstellen)

-------------------------
-------------------------
-------------------------
BILD -------------------
BILD ------------------
-------------------------
-------------------------

Vielleicht hilft dir das weiter, mein Anliegen zu verstehen.
Vielen Dank für dein Bemühen.

[RexDude]

Hmm, kannst das Bild nicht nicht mit css margin oder padding beineflussen?

[Ron]

Hmm, kannst das Bild nicht nicht mit css margin oder padding beineflussen?

Hi RexDude, ich habe eine Möglichkeit gefunden. Classe als Inline-Style und mit margin usw. eingestellt.

Aber jetzt habe ich leider noch ein anderes Problem:
Wie schaff ich es denn, eine ganz normale Leerzeile innerhalb meines Textes im Editorfenster herzustellen? Wenn ich eine Leerzeile mit Enter oder mit Shift+Enter eingebe, wird es beim speichern wieder entfernt. Und wenn ich eine Leerzeile im Quellcode direkt eingebe (<br>), dann wird diese ebenfalls entfernt. es ist oft notwendig innerhalb eines Textpassage eben eine Leerzeile einzugeben, ohne gleich einen neuen Block anlegen zu müssen.
Gibt es da noch einenTrick?
Vielen Dank schon mal

[RexDude]

Ähhh du kannst versuchen mal die Smart Strip Einstellung abzuschalten im Addon.
Allerdings sollte der Redakteur nicht beliebige Abstände definieren dürfen innerhalb eines Textes.
Für den Fall das es doch mal sein soll hab ich ein Minimodul "Abstand", so dass man zumindest immer den Abstand gleich hat.

[Ron]

Ähhh du kannst versuchen mal die Smart Strip Einstellung abzuschalten im Addon.
Allerdings sollte der Redakteur nicht beliebige Abstände definieren dürfen innerhalb eines Textes.
Für den Fall das es doch mal sein soll hab ich ein Minimodul "Abstand", so dass man zumindest immer den Abstand gleich hat.

Hi RexDude,
vielen Dank, funktioniert perfekt
Mit Shift+Enter kann man jetzt Leerzeilen einfügen.
Der Redakteur muss eben auf das Design achten, kein Problem.

Ich habe im CKEditor ein paar Schriftgrößen und 2 alternative Schriften zur Auswahl in der Stile-Dropdownbox zur Verwendung bereitgestellt (Wunsch des Redakteurs). Könnte man dafür auch wieder die beiden originalen Dropdowns des CKE aktivieren (die habe ich auf der CKEditorseite bei der Fullfeatures-Variante gesehen) ?

Tipp?

[RexDude]

Der Redakteur muss eben auf das Design achten, kein Problem.

Hmm du hast wohl mit nem andren Typ Redakteuren zu tun wie ich bis jetzt

Du kannst jederzeit dein Modul anpassen und die Konfig ändern. Schau wies in der Full Version gemacht wurde und übernimms dann. Aber mit der Styles Dropdown list gehts doch auch

[Ron]

Der Redakteur muss eben auf das Design achten, kein Problem.

Hmm du hast wohl mit nem andren Typ Redakteuren zu tun wie ich bis jetzt

Du kannst jederzeit dein Modul anpassen und die Konfig ändern. Schau wies in der Full Version gemacht wurde und übernimms dann. Aber mit der Styles Dropdown list gehts doch auch

Hi RexDude,
meine redakteure möchten eher flexibel sein. Ich ahbe daher das moidul so angepasst, dass man grundsätzlich auf ein fest vorgegebenes Styling zugreift, dann aber alle bzw. die meisten darin enthaltenen Attribute ebenfalls wieder in einem engen Rahen ändern ann -> das ist super flexibel und begrenzt dennoch absolut die CI-Vorgaben, so daß dennoch keiner aus dem vorgegebenen Rahmen kann.

Die beiden zusätzlichen Dropdown dienen nur etwas mehr der Ordnung.

[Ron]

Der Redakteur muss eben auf das Design achten, kein Problem.

Hmm du hast wohl mit nem andren Typ Redakteuren zu tun wie ich bis jetzt

Du kannst jederzeit dein Modul anpassen und die Konfig ändern. Schau wies in der Full Version gemacht wurde und übernimms dann. Aber mit der Styles Dropdown list gehts doch auch

Hi RexDude,
meine redakteure möchten eher flexibel sein. Ich ahbe daher das moidul so angepasst, dass man grundsätzlich auf ein fest vorgegebenes Styling zugreift, dann aber alle bzw. die meisten darin enthaltenen Attribute ebenfalls wieder in einem engen Rahen ändern ann -> das ist super flexibel und begrenzt dennoch absolut die CI-Vorgaben, so daß dennoch keiner aus dem vorgegebenen Rahmen kann.

Die beiden zusätzlichen Dropdown dienen nur etwas mehr der Ordnung.

Hi RexDude,
mit der Anpassung bin ich (bzw. meine Kenntinisse) leider überfordert. Aber vielleicht kannst du mir sagen, wie ich die beiden Zusatz-Tabs beim Tool "Link" wieder aktiviere, damit ich das Aussehen der Links angepasst stylen kann (wegen unterschiedlicher Hintergrundfarben innerhalb der Webseite). Die beiden Zusatz-Tabs sind in der Originalversion des CKEditors (FullFeatured) mit drin, sind aber hier im Redaxo-CKEditor nicht vorhanden.Vielleicht kannst du mir sagen, wie ich diese wieder aktiviere?
Vielen Dank schn mal.

[RexDude]

Tz tz tz....Hausaufgaben muss aber jeder selber machen
Schau dir mal removeDialogTabs beim Lite Modul und beim Standardmodul an

[ralf.schlott]

Ich wollte für die ul eine class vergeben.
Habe in die style.js nun eingetragen:

Code: Alles auswählen

	{ name: 'Checked List',			element: 'ul',		attribute: { 'class': 'list checked' } }

als letzten Punkt natürlich ohne Komma.
Gestern ging es wunderbar. Heute war alles gelöscht. Natürlich habe ich alle Browserdaten gelöscht. Es wieder hergestellt etc.

Ist das denn die richtige Methode?

[RexDude]

Weisheit des Tages:
Wenns so funktioniert ist es die richtige Methode,
wenn nicht dann nicht

[ralf.schlott]

Weisheit des Tages:
Wenns so funktioniert ist es die richtige Methode,
wenn nicht dann nicht

Damit provozierst du aber auch ein Abrutschen eines Threads.

"Man kann nicht alles wissen, aber man muss wissen wo es steht."

Denke Danke!

[Ron]

Tz tz tz....Hausaufgaben muss aber jeder selber machen
Schau dir mal removeDialogTabs beim Lite Modul und beim Standardmodul an

Hi rexDude,
super - Danke hat funktioniert.
Das muss man aber (als Nicht-Vollblut-Programmierer) auch erst mal sehen

Die Lösung ist (für alle):
1. linkShowTargetTab: true, (= zeigt den Tab "Zielseite")
2. removeDialogTabs: ' ', ( = Tabs NICHT entfernen)

Könntest du mir abschließend auch noch einen Gedankenanstoss geben, wo die Zusatz-Tabs des Bild-Tools deaktiviert wurden. Da hab ich natürlich auch schon alles abgesucht, bin aber leider nicht fündig geworden.
Danke auch dafür schon mal, dann soll es das auch gewesen sein, hoffe ich

[RexDude]

Im Standard Editor gibts kein Extra Tab. Dort wurde auch das Image2 Plugin verwendet was meines Wissens nach keine Tabs beseitzt. Image Plugin hat es. Alles weitere auf ckeditor.com bzw. einfach ergooglen

[ralf.schlott]

Weisheit des Tages:
Wenns so funktioniert ist es die richtige Methode,
wenn nicht dann nicht

Damit provozierst du aber auch ein Abrutschen eines Threads.

"Man kann nicht alles wissen, aber man muss wissen wo es steht."

Denke Danke!

Zur Info: Die Scheisse funktioniert.
Und weil ich nett bin:

Code: Alles auswählen

	{ name: 'Checked-List',			element: 'ul',		attributes: { 'class': 'check list' } },	
	{ name: 'Dot-List',				element: 'ul',		attributes: { 'class': 'dot list' } },
	{ name: 'Plus-List',			element: 'ul',		attributes: { 'class': 'list plus' } },
	{ name: 'Square-List',			element: 'ul',		attributes: { 'class': 'list square' } },	
	{ name: 'Dot-O-List',			element: 'ul',		attributes: { 'class': 'dot-o list' } }

[Ron]

Im Standard Editor gibts kein Extra Tab. Dort wurde auch das Image2 Plugin verwendet was meines Wissens nach keine Tabs beseitzt. Image Plugin hat es. Alles weitere auf ckeditor.com bzw. einfach ergooglen

Hallo RexDude,
kannst du mir eventuell sagen, ob und wie ich die erweiterten Tabs der Tabellenfuntion (wie im Original-CKEditor) wieder aktivieren kann? Beim Vergleichen des Quellcodes kann ich die Einschränkung nirgends erkennen.
Der Grund ist, dass ich einer Tabelle eine Classe mitgeben muss, um diese in manchen Fällen anders stylen zu können.
Es würde eigentlich schon sehr helfen, wenn die selben Funtionen wie bei der Redaxo-Version CKEditor-Standard verfügbar wären. Aber ich kann die notwendigen Stellen, die geändert werden müssen, nicht finden.
Vielleicht kannst du mir einen kurzen Tipp geben
Vielen Dank.

[RexDude]

Das geht nicht. Da müsstest du die entsprechenden Originaldateien wiederherstellen (was nicht zu emfpeheln ist wegen Updatefähigkeit erhalten). Ich habe das entfernt weil der Redaktuer hier nicht mit tablespacing etc. rumfummeln soll. Ein Klasse der Tabelle (oder jedem anderen Element) zuweisen kann man aber auch wie in der Readme beschrieben machen, siehe "Custom Styles hinzufügen".