Formatierungsstile in Editor einbauen

[maxroach]

Hallo,

leider ist ja die tolle Seite von Pepe nichtmehr online, an deren Infos ich mich des öfteren geweidet habe.
Ich kann mich erinnern, daß da eine Anleitung enthalten war, wie man Formatierungsstile in den
WYSIWYG-Editor einbauen kann, sodaß man direkt drauf zugreifen kann und nicht im HTML rummachen muss( dann wäre es ja kein Simpelsimpel-Editor mehr...). Wäre toll, wenn mir da jemand auf die Sprünge helfen konnte, wie das gleich wieder ging....

Viele Grüße und Danke
Maxl

[flip-flop]

Einfach mal im BEreich FCK-Editor bewegen und einen Blick in diese beiden Dateien werfen.

- /include/inc_ext/fckeditor/fcktemplates.xml
- /include/inc_ext/fckeditor/fckstyles.xml

(Nachvollziehen kann ich es allerdings auch nicht, weshalb pepe die Seite vom Netz genommen hat).

Knut

[maxroach]

Danke, Flip-Flop,

dann probier ich das mal...wird schon hinhaun!

Grüße
Maxl

[maxroach]

Hallo Flip-Flop,

mein Verständnis reicht leider ohne weitere Hilfe nicht aus.
In der Datei fckstyles.xml kann ich zwar neue Styles hinzufügen, jedoch tauchen sie dann nicht im Editor auf. Da muss also
irgendwo anders auch noch was rein. Ich kann mich auch dunkel daran erinnern, daß bei Pepe sogar ein neues CSS-File angelegt oder zumindest ein bestehendes ergänzt wurde. Auch die CSS-Steuerung dieser Styles ist mir nicht klar. Wie kann ich diese von mir angelegten Stile per css steuern?

Doof, daß ich das nicht genauer beschreiben kann, aber vielleicht weißt Du ja, was ich meine...


Danke für Deine Hilfe
Maxl

[nora0355]

schau mal da nach:

http://www.yaml.phpwcms.org/fckeditor.phtml

ist zwar auf yaml bezogen, aber vielleicht hilft es dir ja.

Rainer

[flip-flop]

Bsp.: In der /include/inc_ext/fckeditor/fckstyles.xml

Code: Select all

	<Style name="Kreis rot - links" element="span">
		<Attribute name="class" value="fck_rund_rot" />
	</Style> 

CSS
in /template/inc_css/frontend.css
und
/include/inc_ext/fckeditor/editor/css/fck_editorarea.css (wenn dein style auch im Editor sichtbar sein soll).

Code: Select all

.fck_rund_rot {
	background: url(../../picture/upload/images/16x16/rund_rot.gif) no-repeat 0px top;
	padding-left: 16px;
}

Für die Darstellung im Frontend wird die Klasse einfach in eine CSS-Datei eingetragen, die während deines Seitenaufrufs aktiv ist, hier z.B. frontend.css.
Für die Darstellung im BE muss dann die fck_editorarea.css herhalten.


Die Dateinamen/orte können in der /include/inc_ext/fckeditor/fckconfig.js umgestellt werden. z.B.

Code: Select all

/* FCKConfig.EditorAreaCSS = FCKConfig.BasePath + 'css/fck_editorarea.css' ; */
FCKConfig.EditorAreaCSS = '/template/inc_css/fck_editorarea.css' ;


/* FCKConfig.StylesXmlPath		= FCKConfig.EditorPath + 'fckstyles.xml' ; */
FCKConfig.StylesXmlPath		= FCKConfig.EditorPath + 'my_fckstyles.xml' ;
/* FCKConfig.TemplatesXmlPath	= FCKConfig.EditorPath + 'fcktemplates.xml' ; */
FCKConfig.TemplatesXmlPath	= FCKConfig.EditorPath + 'my_fcktemplates.xml' ;

Rufe doch bitte einmal einige fertige Styles in einem Testtext auf und schau dir den generierten Quellkode an. Dann wird klar was dort passiert.

Knut