Permanente Bild-Vorschau im Editor

Ein CMSimple Support Forum für deutsch sprechende Nutzer und Entwickler
mhz
Posts: 637
Joined: Tue Jun 25, 2013 8:46 pm
Location: Heusenstamm, Hessen
Contact:

Permanente Bild-Vorschau im Editor

Post by mhz » Mon Jul 29, 2013 7:52 am

Hallo zusammen,

vor einigen Wochen hatte ich mal in _XH / 4.x mit Tinymce ein Plugin installiert, das mir die Bilder in der Vorschau permanent anzeigte und nicht erst beim Überfahren des entsprechenden Datei-Namens. Kann mir bitte jmd. helfen, welches Plugin dieses kann.

Ganz großen Dank im Voraus!

Gruß
Michael
Michael Zajusch (mhz)-- Mein Tutorial für CMSimple_XH. Früher

Gert
Posts: 3075
Joined: Fri May 30, 2008 4:53 pm
Location: Berlin
Contact:

Re: Permanente Bild-Vorschau im Editor

Post by Gert » Mon Jul 29, 2013 9:34 am

Hallo Michael,

da kann ich mal wieder nur raten, was Du meinst. Ich denke, Du meinst den Filebrowser im "Bild einfügen Dialog".

Da haben wir das extra so gemacht, damit man nicht so viel scrollen muss, wenn da viele Bilder liegen.

Wenn Du das nicht so haben willst, kannst Du einfach in "./css/core.css" ganz hinten anhängen:

Code: Select all

/* my adds */

#xhFilebrowser div#files li {
clear: both;
}

a.xhfbfile span, #xhFilebrowser #files ul li a.xhfbfile span {
display: block;
float: right;
border: #aaa 1px solid;
padding: 2px;
background-color: #ddd;
}
Das musst Du dann aber nach jedem Update neu machen, weil die core.css im Update (CMSimple 4.0 => 4.x.x) enthalten ist,

Gert
Gert Ebersbach | CMSimple | Templates - Plugins - Services

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

Re: Permanente Bild-Vorschau im Editor

Post by cmb » Mon Jul 29, 2013 10:10 am

mhz wrote:vor einigen Wochen hatte ich mal in _XH / 4.x mit Tinymce ein Plugin installiert, das mir die Bilder in der Vorschau permanent anzeigte und nicht erst beim Überfahren des entsprechenden Datei-Namens. Kann mir bitte jmd. helfen, welches Plugin dieses kann.
Du meinst vermutlich hi_KCFinder oder Ajaxfilemanager_XH.

Mit dem Tipp von Gert klappt's aber auch mit dem Standard-Filebrowser.
Christoph M. Becker – Plugins for CMSimple_XH

mhz
Posts: 637
Joined: Tue Jun 25, 2013 8:46 pm
Location: Heusenstamm, Hessen
Contact:

Re: Permanente Bild-Vorschau im Editor

Post by mhz » Mon Jul 29, 2013 10:18 am

Hallo Gert, Hallo Christoph!

Danke Gert, das mit Deinem Code teste ich auch mal später. Das muss ich mir dann gesondert aufschreiben.
Ich hatte vermutlich den KCFinder installiert; den werde ich nachher noch mal testen. Von dem Ajax... lese ich gerade zum 1. Mal.

Gruß
Michael
Michael Zajusch (mhz)-- Mein Tutorial für CMSimple_XH. Früher

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

Re: Permanente Bild-Vorschau im Editor

Post by cmb » Mon Jul 29, 2013 10:40 am

mhz wrote: Von dem Ajax... lese ich gerade zum 1. Mal.
Leider ist die Dokumentation von CMSimple(_XH) nicht die beste. Immerhin gibt es im XH-Wiki einen Artikel zu den Filebrowsern, die bei CMSimple_XH 1.5 eingeführt wurden: http://www.cmsimple-xh.org/wiki/doku.php/de:filebrowser; dort werden die beiden Alternativen auch genannt. Der Vollständigkeit halber sollte auch FileAdm erwähnt werden; der funktioniert aber nur wenn man Dateien->... aufruft, nicht aber aus dem Editor heraus.
Christoph M. Becker – Plugins for CMSimple_XH

Ulrich

Re: Permanente Bild-Vorschau im Editor

Post by Ulrich » Mon Jul 29, 2013 6:11 pm

Danke Gert...

für den Codeschnipsel. Klappt wunderbar. (cmsimple_xh 1.5.7)

Gibts in irgendeiner CSS Datei die Chance die Breite der Vorschaubilder zu ändern?

Ulrich

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

Re: Permanente Bild-Vorschau im Editor

Post by cmb » Tue Jul 30, 2013 12:27 am

Ulrich wrote:Klappt wunderbar. (cmsimple_xh 1.5.7)
Erfreulich. :)
Ulrich wrote:Gibts in irgendeiner CSS Datei die Chance die Breite der Vorschaubilder zu ändern?
Grundsätzlich ist es nicht entscheidend zusätzliches bzw. geändertes CSS in einer bestimmten CSS-Datei zu definieren. Für den Browser spielt lediglich die Reihenfolge der Regeln eine Rolle (die Reihenfolge, in der die diversen Stylesheets geladen werden, kann man recht gut im HTML-Quelltext der Website einsehen). Darüber hinaus ist die so genannte Spezifität sehr entscheidend. Nur bei Regeln mit gleicher Spezifität spielt die Reihenfolge der Regeln eine Rolle: es wird dann immer die zuletzt definierte genommen. Bei Bedarf kann man Regeln per "!important" forcieren:

Code: Select all

p {color: red !important}
Um nun die Vorschaubilder des Filebrowsers auf eine bestimmte Größe zu skalieren, kann man folgende Regel ergänzen:

Code: Select all

#files > ul > li > a > span > img {width: 200px; height: auto}
(das sollte unter halbwegs modernen Browsern funktionieren; IE ab 8?)

Wo trägt man nun die Regeln am besten ein? Am besten da, wo sie beim nächsten CMSimple(_XH)-Update nicht überschrieben werden. Verwendet die gesamte Website also immer das selbe Template, und gedenkt man auch nicht, dieses irgendwann zu ändern, dann eben im Template-Stylesheet. Verwendet man mehrere Templates oder möchte sich die Option offen halten ein anderes Template zu verwenden, dann kann man solche CSS-Anpassung im Stylesheet des jeweiligen Plugins oder in css/core.css vornehmen. Diese Dateien werden aber möglicherweise bei einem Software-Update überschrieben. Daher kann man sich auch eine eigene CSS anlegen (z.B. css/my.css), in der man alle individuellen Anpassungen vornimmt. Damit diese Datei auch in der Website verwendet wird, kann man sie in cmsimple/userfuncs.php einbinden:

Code: Select all

$hjs .= tag('link rel="stylesheet" href="' . $pth['folder']['base'] . 'css/my.css" type="text/css"');
(Die definierten Regeln greifen allerdings nicht mehr nach einem Update, bei dem sich die Selektoren ändern.)
Christoph M. Becker – Plugins for CMSimple_XH

mhz
Posts: 637
Joined: Tue Jun 25, 2013 8:46 pm
Location: Heusenstamm, Hessen
Contact:

Re: Permanente Bild-Vorschau im Editor

Post by mhz » Tue Jul 30, 2013 6:45 am

Hallo Gert!
Gert wrote:... kannst Du einfach in "./css/core.css" ganz hinten anhängen
Danke, genau das hat hervorragend gut geklappt.

Gruß
Michael
Michael Zajusch (mhz)-- Mein Tutorial für CMSimple_XH. Früher

Gert
Posts: 3075
Joined: Fri May 30, 2008 4:53 pm
Location: Berlin
Contact:

Re: Permanente Bild-Vorschau im Editor

Post by Gert » Tue Jul 30, 2013 3:19 pm

Hallo,

in CMSimple 4.2.3 wird man konfigurieren können, ob die Bilder im Filebrowser permanent sichtbar sind oder nur bei mouseover ;)

Die Grösse der Vorschaubilder ist per CSS anpassbar (aber nur in der neuen Version).

core.css:

Code: Select all

#files a span img {
width: 96%;
max-width: 160px;   /* the width of the thumbs / Hier die Grösse der Bilder einstellen */
height: auto;
border: 1px solid #666;
padding: 0;
margin: 6px 0 0 0;
}
Habe bei der Gelegenheit gleich mal die Bildanzeige des Filebrowers modernisiert und entschlackt,

Gert
Gert Ebersbach | CMSimple | Templates - Plugins - Services

Gert
Posts: 3075
Joined: Fri May 30, 2008 4:53 pm
Location: Berlin
Contact:

Re: Permanente Bild-Vorschau im Editor

Post by Gert » Tue Jul 30, 2013 5:57 pm

Hallo,

habe mal ein Update CMSimple 4.0 => 4.2.3 beta hochgeladen.

Es gibt 2 neue Konfigurationsmöglichkeiten unter "Filebrowser" in der CMS Konfiguration:

Show_images_permanent: "true" zeigt die Bilder permanent, alles andere wie gehabt (nur bei mouseover)

Maxwidth_of_thumbs: Hier könnt Ihr die Breite der Vorschaubilder in px eingeben.

Das Update funktioniert nur für CMSimple 4, ich biete diese "Preview" aber hier an, weil dieses Thema nun mal hier aufgekommen ist,

freue mich auf Eure Berichte,

Gert

Download: http://www.ge-webdesign.de/downloads/up ... 3_beta.zip
Gert Ebersbach | CMSimple | Templates - Plugins - Services

Post Reply