CKEditor eigenes CSS

Ein CMSimple Support Forum für deutsch sprechende Nutzer und Entwickler
Traktorist
Posts: 235
Joined: Mon Mar 07, 2011 4:34 pm
Location: South of Lower Saxony, Germany

CKEditor eigenes CSS

Post by Traktorist » Sat Feb 18, 2012 4:54 pm

Hallo zusammen,

wo kann man für den CKEditor einstellen, dass er das eigene und nicht das Seiten CSS verwendet.

Gruß, Ele

cmb
Posts: 13422
Joined: Tue Jun 21, 2011 11:04 am
Location: Mü-Sa, RLP, DE
Contact:

Re: CKEditor eigenes CSS

Post by cmb » Sat Feb 18, 2012 5:14 pm

Hallo Ele,

das macht man in plugins/ckeditor/inits/init_*.js (also entweder in allen 4 Dateien, oder nur in derjenigen, die man als Toolbar gewählt hat). Dort steht die Zeile:

Code: Select all

contentsCss : '%STYLESHEET%',
Diese kann einfach gelöscht werden. Oder man kann ein ganz anderes Stylesheet einbinden, indem man den Datei-Pfad statt %STYLESHEET% angibt.

Christoph
Christoph M. Becker – Plugins for CMSimple_XH

Traktorist
Posts: 235
Joined: Mon Mar 07, 2011 4:34 pm
Location: South of Lower Saxony, Germany

Re: CKEditor eigenes CSS

Post by Traktorist » Sun Feb 19, 2012 1:24 pm

Hi Christoph,

herzlichen Dank für die schnelle und kompetente Antwort.
Ins .JS hätte ich nie geschaut ;)

Gruß, Ele

Holger
Site Admin
Posts: 3239
Joined: Mon May 19, 2008 7:10 pm
Location: Hessen, Germany
Contact:

Re: CKEditor eigenes CSS

Post by Holger » Sun Feb 19, 2012 2:31 pm

Hi,

alternativ könnte man auch in styleshett.css nur die für den Editor relevanten Einträge machen und den Rest mittels @import aus einer anderen Datei inkludieren.


LG
Holger

cmb
Posts: 13422
Joined: Tue Jun 21, 2011 11:04 am
Location: Mü-Sa, RLP, DE
Contact:

Re: CKEditor eigenes CSS

Post by cmb » Sun Feb 19, 2012 2:52 pm

Hallo Holger,
Holger wrote:und den Rest mittels @import aus einer anderen Datei inkludieren.
Gibt's da nicht evtl. Probleme mit dem stylesheetparser-Plugin unter FF?

Ich hab's gerade noch mal getestet: ein @import lässt die Initialisierung des Editors im FF abstürzen, wenn das stylesheetparser-Plugin aktiviert ist, so dass die geänderte Formatierung des (X)HTML-Quellcodes nicht duchgeführt wird.

Christoph
Christoph M. Becker – Plugins for CMSimple_XH

Holger
Site Admin
Posts: 3239
Joined: Mon May 19, 2008 7:10 pm
Location: Hessen, Germany
Contact:

Re: CKEditor eigenes CSS

Post by Holger » Sun Feb 19, 2012 3:13 pm

cmb wrote:Gibt's da nicht evtl. Probleme mit dem stylesheetparser-Plugin unter FF?
Stimmt wohl. Selber habe ich das noch nicht weiter getestet. Generell hat das Plugin aber noch einige Unzulänglichkeiten.
Aber auch diesee Bugs wird wohl noch gefixt werden...

Generell wäre aber auch ein "editorstyles.css" möglich und vielleicht sogar besser.
Die Designer müssten Styles für den Content eben nur in einer gesonderten Datei anbieten.
Das wäre sehr "userfreundlich".


LG
Holger

Lariss
Posts: 159
Joined: Thu Dec 16, 2010 8:32 am

Re: CKEditor eigenes CSS

Post by Lariss » Wed Feb 22, 2012 6:00 pm

Hallo Christoph,
ich habe die ckeditor bei mir lokal installiert. Ich habe bei der Einstellung Toolbar: full gewählt.
Erstens bei mir war von Anfang an die Still alles weiß (kein Eintrag). Dann habe ich wie du gesagt hast

Code: Select all

contentsCss : '%STYLESHEET%',
gelöscht, es bleibt nach wie vor unverändert. Dann habe Ich den Pfad zu meinem stylesheet.css eingegeben wie:

Code: Select all

contentsCss : ' templates/pitpl_shop/stylesheet.css',
Es ändert sich aber leider an Ckeditor Still nichts, es bleibt leer!

Gruss
Lariss
Gruß Sam

cmb
Posts: 13422
Joined: Tue Jun 21, 2011 11:04 am
Location: Mü-Sa, RLP, DE
Contact:

Re: CKEditor eigenes CSS

Post by cmb » Wed Feb 22, 2012 6:25 pm

Hallo Lariss,

zunächst einmal muss man wissen, dass der CKEditor die Stile kontext-sensitiv anzeigt, d.h. es werden nur diejenigen angezeigt, die für die aktuelle Cursorposition oder Auswahl sinnvoll sein könnten. Und es müssen entsprechende Stile vorhanden sein.

Zum Testen: man definiert p.zum_testen {background:yellow} im Stylesheet und setzt den Cursor in einen normalen Paragraphen. Dann sollte p.zum_testen angezeigt werden.

Ich vermute aber, dass es bei Dir an der Unzulänglichkeit des Stylesheetparsers des CKEditors liegt, der unter Firefox nicht mit @-Direktiven im Stylesheet klar kommt. Das sollte einen JS-Fehler geben -- schau mal in die Fehlerkonsole (F12).

Wenn das so ist, hilft entweder Umschreiben des Stylesheets (verzicht auf @import & Co.), oder manuelles Konfigurieren der Style-Selectbox (http://docs.cksource.com/CKEditor_3.x/D ... ide/Styles).

Christoph
Christoph M. Becker – Plugins for CMSimple_XH

Lariss
Posts: 159
Joined: Thu Dec 16, 2010 8:32 am

Re: CKEditor eigenes CSS

Post by Lariss » Wed Feb 22, 2012 7:11 pm

Hallo Christoph,

herzichen Dank für deine Tipps.
Das werde ich ausprobieren, sobald ich Zeit finde.

Gruss
Lariss
Gruß Sam

Lariss
Posts: 159
Joined: Thu Dec 16, 2010 8:32 am

Re: CKEditor eigenes CSS

Post by Lariss » Fri Feb 24, 2012 6:40 am

Hallo Christoph,
deine Tipps sind Gold wert. Es ist wirklich so, dass wichtige Formatierungselemente in Stil angezeigt werden. Ich habe beispielsweise
blockquote.kursiv und font.ret in meinem stylesheet.css definiert, und sie tauchen tatsächlich in Ckeditor auf.
Nochmals vielen Dank.
Gruss
Lariss
Gruß Sam

Post Reply