CSS-Klassen im Editor besser nutzen

Fragen zur Implementierung und/oder Anpassung von ConPresso 4 werden in diesem Forum diskutiert.
Benutzeravatar
MarkusR
Handbuchversteher
Beiträge: 7361
Registriert: 01.01.1970 01:00
Hat sich bedankt: 110 Mal
Danksagung erhalten: 933 Mal
Kontaktdaten:

CSS-Klassen im Editor besser nutzen

Beitrag von MarkusR »

Nach über 2 Jahren Wartezeit habe ich mir den Wunsch aus
http://community.conpresso.de/viewtopic ... 7851#17851
jetzt selbst erfüllt.

Dazu editiert man editor.php wie folgt

== SUCHE ==
ca. Zeile 96/97

Code: Alles auswählen

    </script>
    <script src="<?php echo BASE_REL.'_editor/editor.js'; ?>" type="text/javascript"></script>
== DAVOR, EINFÜGEN ==

Code: Alles auswählen

	function showClasses()
	{
	// remove all possible class elements from the class selector
        for (var i=document.getElementById('class_select').length; i--; ) {
            document.getElementById('class_select').remove(0);
        }

	// add empty option element
        var newOption = document.createElement('option');
        newOption.text = '';
        newOption.value = '';
        try {
            document.getElementById('class_select').add(newOption, null); // standards compliant; doesn't work in IE
        } catch(e) {
            document.getElementById('class_select').add(newOption); // IE only
        }

	// add other option elements
        for (var i=0; i<allowedStyles.length; i++) {
            if (allowedStyles[i].charAt(0)!='.' 
                && allowedStyles[i].substr(0, settingsNode.tagName.length).toLowerCase()!= settingsNode.tagName.toLowerCase()) continue;
            var newOption = document.createElement('option');
            newOption.text = allowedStyles[i];
            newOption.value = allowedStyles[i].substring(allowedStyles[i].indexOf('.')+1);

            try {
                document.getElementById('class_select').add(newOption, null); // standards compliant; doesn't work in IE
            } catch(e) {
                document.getElementById('class_select').add(newOption); // IE only
            }
        }
	}

== SUCHE ==

Code: Alles auswählen

<body class="darker" style="margin: 0.5em;" onLoad="initializeEditor()">
== ERSETZEN MIT ==

Code: Alles auswählen

<body class="darker" style="margin: 0.5em;" onLoad="initializeEditor();showClasses()">
== SUCHE ==

Code: Alles auswählen

<!--  -->
(kommt zweimal vor, einmal vor und einmal nach der Snippets-Auswahl. Benutzen kann man beide Positionen, je nach Vorliebe. Besser sieht es an der zweiten Position aus...)

== DANACH, EINFÜGEN ==

Code: Alles auswählen

CSS-Klasse:
	<script type="text/javascript">
		var allowedStyles = new Array();
		<?php 
		$a = explode(' ', $cpoSystem['editorCSS']);
		sort($a);
		foreach ($a as $v) {
			if (empty($v)) continue;
			echo 'allowedStyles.unshift(\''.$v.'\');';
		}
		?>
	</script>
	<input type="text" class="text" id="edit_universal_class" onChange="updateAttribute('class', this.value);" <?php
	if (!empty($cpoSystem['editorCSS'])) echo 'style="display: none;"'; ?> />

	<select id="class_select" onChange="updateAttribute('class', this.value);" <?php
	if (empty($cpoSystem['editorCSS'])) echo 'style="display: none;"'; ?>>
	</select>
<!--  -->
P.S. ja, dieses Feld zeigt nicht die aktuelle Klasse an, aber auch das könnte man noch mit zwei Handgriffen nachpflegen...
Dateianhänge
css-select.gif
Ciao Markus
ConPresso-Module

Kein Support per PN!!! Für Fragen und Diskussionen ist das Forum da!

Succi recentis officinalis
Hochwertige Kräutersäfte und -Öle
Benutzeravatar
baluo
ConPresso-Experte
Beiträge: 607
Registriert: 14.11.2005 12:17
Hat sich bedankt: 216 Mal
Danksagung erhalten: 11 Mal

Beitrag von baluo »

danke, markus, fuer dieses leicht verspaetete nikolausgeschenk :-)

heisst das de facto, dass dieses klappmenue nur die bisherige fassung unter universelle Attribute ersetzt?
P.S. ja, dieses Feld zeigt nicht die aktuelle Klasse an, aber auch das könnte man noch mit zwei Handgriffen nachpflegen...
das waere natuerlich noch hilfreich, vor allem auch, wenn durch einen klick in die leezeile des klappmenues die aktive css-klasse wieder deaktiviert wird (in der bisherigen fassung scheint das - ausser im ff - nur durch eingriff in den quelltext zu gehen ... wie ich heute beim training eines meiner klienten im ie7 erkennen musste).

ciao, gerhard
Benutzeravatar
MarkusR
Handbuchversteher
Beiträge: 7361
Registriert: 01.01.1970 01:00
Hat sich bedankt: 110 Mal
Danksagung erhalten: 933 Mal
Kontaktdaten:

Beitrag von MarkusR »

baluo hat geschrieben:heisst das de facto, dass dieses klappmenue nur die bisherige fassung unter universelle Attribute ersetzt?
Nein, es ist ein zusätzliches Feld.
Es wäre sogar einfacher das bisherige Feld umzupositionieren, dann wäre auch die Anzeige der aktuellen Klasse wieder da.
beim training eines meiner klienten
Du Glücklicher...
vor allem auch, wenn durch einen klick in die leezeile des klappmenues die aktive css-klasse wieder deaktiviert wird (in der bisherigen fassung scheint das - ausser im ff - nur durch eingriff in den quelltext zu gehen
Theoretisch geht das auch beim IE. Leider wird aber beim Wechseln des Bearbeitungsmodus aus class="test" dann class=test gemacht. Sodann findet der IE den Rückweg nicht mehr... das ist aber wieder eines der im Internet viel diskutierten IE-Probleme... (suche mal nach "innerHTML Anführungszeichen")

Nachtrag: Inzwischen habe ich auch eine Lösung für den IE gefunden (Benutzen von className statt class), dann funzt es aber in den anderen Browsern nicht mehr. Und wie nun die Browserweiche von B&S aussieht habe ich noch nicht kapiert...
Ciao Markus
ConPresso-Module

Kein Support per PN!!! Für Fragen und Diskussionen ist das Forum da!

Succi recentis officinalis
Hochwertige Kräutersäfte und -Öle
Benutzeravatar
MarkusR
Handbuchversteher
Beiträge: 7361
Registriert: 01.01.1970 01:00
Hat sich bedankt: 110 Mal
Danksagung erhalten: 933 Mal
Kontaktdaten:

Beitrag von MarkusR »

Vielleicht geht das hier ja:

hier eine Version, mit der sich die Klassen auch im IE löschen lassen. Daß beim Auswählen von "nichts" nachher ein class="" übrigbleibt ist vollkommen ok und sogar standardkonform, da es diese Eigenschaft immer gibt, auch wenn sie nicht angegeben wird.

Die beiden Dateien nach einem Backup ins Verzeichnis _editor packen und hier dann ein Feedback abgeben.

edit: Download gelöscht... -> Testphase -> Feedback -> dann mal sehen...
Zuletzt geändert von MarkusR am 16.12.2008 13:54, insgesamt 1-mal geändert.
Ciao Markus
ConPresso-Module

Kein Support per PN!!! Für Fragen und Diskussionen ist das Forum da!

Succi recentis officinalis
Hochwertige Kräutersäfte und -Öle
Benutzeravatar
MarkusR
Handbuchversteher
Beiträge: 7361
Registriert: 01.01.1970 01:00
Hat sich bedankt: 110 Mal
Danksagung erhalten: 933 Mal
Kontaktdaten:

Beitrag von MarkusR »

Bild class_editor.zip - 15.33
5 mal
MarkusR hat geschrieben:... und hier dann ein Feedback abgeben.
Naja, so ist das mit "geben und nehmen"...
Ciao Markus
ConPresso-Module

Kein Support per PN!!! Für Fragen und Diskussionen ist das Forum da!

Succi recentis officinalis
Hochwertige Kräutersäfte und -Öle
Benutzeravatar
Mr. Magpie
ConPresso-Profi
Beiträge: 1004
Registriert: 01.01.1970 01:00
Wohnort: Wuppertal
Hat sich bedankt: 274 Mal
Danksagung erhalten: 59 Mal

Beitrag von Mr. Magpie »

ICH, hab's bisher nicht heruntergeladen/getestet, sonst hättest du schon längst ein Feedback! :P
Günther Ludwig
Benutzeravatar
MarkusR
Handbuchversteher
Beiträge: 7361
Registriert: 01.01.1970 01:00
Hat sich bedankt: 110 Mal
Danksagung erhalten: 933 Mal
Kontaktdaten:

Beitrag von MarkusR »

Bild class_editor.zip - 15.33
12 mal
Ok... jetzt erst mal Testphase... sollte jemand seine Testdateien nicht mehr brauchen kann er sie an den nächsten Tester weitergeben...
Ciao Markus
ConPresso-Module

Kein Support per PN!!! Für Fragen und Diskussionen ist das Forum da!

Succi recentis officinalis
Hochwertige Kräutersäfte und -Öle
Benutzeravatar
baluo
ConPresso-Experte
Beiträge: 607
Registriert: 14.11.2005 12:17
Hat sich bedankt: 216 Mal
Danksagung erhalten: 11 Mal

Beitrag von baluo »

[quote="MarkusR]Naja, so ist das mit "geben und nehmen"...[/quote]

Hi Markus,

danke fuer dieses Modul -- ich habe es leider noch nicht testen koennen, weil ich derzeit beruflich zum grossteil anderweiitig verplant bin ... aber ich komme darauf zurueck.

Soweit erst schon mal DANKE!

Ciao, Gerhard
Benutzeravatar
Mr. Magpie
ConPresso-Profi
Beiträge: 1004
Registriert: 01.01.1970 01:00
Wohnort: Wuppertal
Hat sich bedankt: 274 Mal
Danksagung erhalten: 59 Mal

Beitrag von Mr. Magpie »

MarkusR hat geschrieben:
Bild class_editor.zip - 15.33
12 mal
Ok... jetzt erst mal Testphase... sollte jemand seine Testdateien nicht mehr brauchen kann er sie an den nächsten Tester weitergeben...
Ich hätte jetzt Lust, das Teil zu testen. Wer kann's mir weitergeben?
Günther Ludwig
Benutzeravatar
Mr. Magpie
ConPresso-Profi
Beiträge: 1004
Registriert: 01.01.1970 01:00
Wohnort: Wuppertal
Hat sich bedankt: 274 Mal
Danksagung erhalten: 59 Mal

Beitrag von Mr. Magpie »

Danke Markus, dass du mir class_editor.zip inzwischen zur Verfügung gestellt hast.

Ich hab's auch gleich erfolgreich auf zwei lokalen Installationen (Server2Go) getestet und dann einigen Kunden zum Testen gegeben.

Wie Schwaben halt so sind - "nix g'sagt isch g'nug g'lobt" - erwarte ich keine große Rückmeldung. Wenn's klemmt, erfährst du's aber auf jeden Fall als Erster ;)

Zur Verwendung der CSS-Klassen im Editor hätte ich aber noch eine kleine Frage, weil mir das eben heute wieder begegnet ist: Warum soll die CSS-Datei mit den Klassendefinitionen als "absolute URL" angegeben werden? Kann es sein, dass das nur bei einigen wenigen Hostern/Webservern Probleme macht, wenn diese relativ angegeben wird?

BTW, vielleicht lesen ja Bartels&Schöne mit: Die Beschreibung, wie die Klassen aufgelistet werden können/sollen, könnte im Manual etwas klarer sein - ich jedenfalls, habe wieder einmal fast alles durchprobiert, Semikolon-getrennte Liste, dann Komma-getrennte Liste, schließlich (erfolgreich) eine Leerzeichen-getrennte Liste.
Günther Ludwig
Benutzeravatar
MarkusR
Handbuchversteher
Beiträge: 7361
Registriert: 01.01.1970 01:00
Hat sich bedankt: 110 Mal
Danksagung erhalten: 933 Mal
Kontaktdaten:

Beitrag von MarkusR »

Zur Verwendung der CSS-Klassen im Editor hätte ich aber noch eine kleine Frage, weil mir das eben heute wieder begegnet ist: Warum soll die CSS-Datei mit den Klassendefinitionen als "absolute URL" angegeben werden? Kann es sein, dass das nur bei einigen wenigen Hostern/Webservern Probleme macht, wenn diese relativ angegeben wird?
Habe ich mir noch nie Gedanken drüber gemacht.

Hintergrund dürfte die (von mir praktisch nie genutzte performancekillende) Möglichkeit der Einbindung per Javascript bzw. PHP-include sein, bei der die Pfade zum ConPresso-Verzeichnis nicht die des übergeordneten relativen Verzeichnisses sind.
Ciao Markus
ConPresso-Module

Kein Support per PN!!! Für Fragen und Diskussionen ist das Forum da!

Succi recentis officinalis
Hochwertige Kräutersäfte und -Öle
Benutzeravatar
balu
ConPresso-Entwickler
Beiträge: 1748
Registriert: 01.01.1970 01:00
Hat sich bedankt: 81 Mal
Danksagung erhalten: 133 Mal

Beitrag von balu »

Hiho,

CSS per Komma, Punkt oder Semikolon zu trennen ist leider nicht ganz so praktisch, weil die Zeichen eben auch in den CSS-Definitionen vorkommen ;-). Darum sind Leerzeichen die bessere Wahl.

Die Einbindung per PHP / Javascript war ursprünglich dafür gedacht, Content auf externen Seiten einzubinden. Aus dem Grund müssen diese Sachen immer als absolute URLs angegeben werden.

Dass lokale Einbinden für Sidebars usw. ist darum quasi ein kleiner "Missbrauch" dieser Funktion.

Balu
Bartels.Schöne
ConPresso Support & Development
Benutzeravatar
Mr. Magpie
ConPresso-Profi
Beiträge: 1004
Registriert: 01.01.1970 01:00
Wohnort: Wuppertal
Hat sich bedankt: 274 Mal
Danksagung erhalten: 59 Mal

Beitrag von Mr. Magpie »

balu hat geschrieben:CSS per Komma, Punkt oder Semikolon zu trennen ist leider nicht ganz so praktisch, weil die Zeichen eben auch in den CSS-Definitionen vorkommen ;-). Darum sind Leerzeichen die bessere Wahl.
Naja, Leerzeichen verwende ich im Zusammenhang mit CSS eben tagtäglich bei Nachfahren-Selektoren, während bspw. Semikolons eher innerhalb einer Style-Anweisung Verwendung finden.
Aber egal, die Darstellung im Manual als ungeordnete Liste ist jedenfalls irritierend.
balu hat geschrieben:Die Einbindung per PHP / Javascript war ursprünglich dafür gedacht, Content auf externen Seiten einzubinden. Aus dem Grund müssen diese Sachen immer als absolute URLs angegeben werden.

Dass lokale Einbinden für Sidebars usw. ist darum quasi ein kleiner "Missbrauch" dieser Funktion.
Das ist natürlich ein Argument. Ich kam allerdings in all den Jahren praktisch nie in die Verlegenheit nicht-lokal einzubinden. Jetzt dämmert's mir auch so langsam, warum Markus immer schreibt, mit relativen URLs würde man sich in Sachen PHP/Javascript-Einbindung selbst ein Bein stellen. Bei meinen lokalen Einbindungen war das immer problemlos.
Günther Ludwig
Benutzeravatar
Mr. Magpie
ConPresso-Profi
Beiträge: 1004
Registriert: 01.01.1970 01:00
Wohnort: Wuppertal
Hat sich bedankt: 274 Mal
Danksagung erhalten: 59 Mal

Beitrag von Mr. Magpie »

Hab' von Markus nun eine zweite Version erhalten. Mit dieser tritt das geschilderte Problem nicht auf.
Werd's nächste Woche ausrollen und weiter testen lassen.
Günther Ludwig
Benutzeravatar
Mr. Magpie
ConPresso-Profi
Beiträge: 1004
Registriert: 01.01.1970 01:00
Wohnort: Wuppertal
Hat sich bedankt: 274 Mal
Danksagung erhalten: 59 Mal

Beitrag von Mr. Magpie »

Hallo Markus,

muss leider sagen: immer noch keine Probleme mit der neuen Version :D
Günther Ludwig
Antworten