CSS-Stylesheets in WYSIWYG-Editor-Ansicht einbinden
Verfasst: Fr 4. Jan 2013, 18:14
Hallo liebe webEdition-Gemeinde,
ich kann mir kaum vorstellen, dass nicht Jemand schon einmal den Wunsch gehabt hat, dass die WYSIWYG-Editor-Ansicht genau so aussieht, wie der Content-Bereich der Webseite dann schlussendlich im Web-Browser. Also z.b. wenn die h1 Überschrift immer blau ist und genau 32px groß, dann sollte diese Überschrift auch während dem Editieren im WYSIWYG so aussehen. Weiters sollte auch die breite des WYSIWYG-Editor-Fensters zu der Content-Breite passen.
Gibt es eine Möglichkeit zu definieren, welche Stylesheets in die WYSIWYG-Editor-Ansicht eingebunden werden sollen (nicht CSS-Klassen sondern Stylesheets!)?
Ich löse das ganze im Moment immer so, dass ich die Datei:
webEdition/editors/content/wysiwyg/weWysiwyg.js
anpasse und einfach folgende Zeile(n), nach der Zeile 579, einfüge:
this.eDocument.write('<style type="text/css">....HIER DIE CSS-Definitionen (minified)....</style>');
(...unter anderem auch den minified CSS-Reset von Yahoo)
=> Das funktioniert wunderbar ist aber natürlich eine sehr hässliche Lösung - gibt es hier andere Möglichkeit?
Danke und viele Grüsse,
Alex
ich kann mir kaum vorstellen, dass nicht Jemand schon einmal den Wunsch gehabt hat, dass die WYSIWYG-Editor-Ansicht genau so aussieht, wie der Content-Bereich der Webseite dann schlussendlich im Web-Browser. Also z.b. wenn die h1 Überschrift immer blau ist und genau 32px groß, dann sollte diese Überschrift auch während dem Editieren im WYSIWYG so aussehen. Weiters sollte auch die breite des WYSIWYG-Editor-Fensters zu der Content-Breite passen.
Gibt es eine Möglichkeit zu definieren, welche Stylesheets in die WYSIWYG-Editor-Ansicht eingebunden werden sollen (nicht CSS-Klassen sondern Stylesheets!)?
Ich löse das ganze im Moment immer so, dass ich die Datei:
webEdition/editors/content/wysiwyg/weWysiwyg.js
anpasse und einfach folgende Zeile(n), nach der Zeile 579, einfüge:
this.eDocument.write('<style type="text/css">....HIER DIE CSS-Definitionen (minified)....</style>');
(...unter anderem auch den minified CSS-Reset von Yahoo)
=> Das funktioniert wunderbar ist aber natürlich eine sehr hässliche Lösung - gibt es hier andere Möglichkeit?
Danke und viele Grüsse,
Alex