Hallo zusammen,
Die meisten von euch kennen wahrscheinlich das Problem, dass die Click Vergrösserung in FCE's nicht ohne weiteres funktioniert. Ich stand auch vor dem Problem und wollte zudem noch die Extension kj_imagelightbox2 als Click Vergrösserung verwenden. Naja, darum hab ich n wenig angefangen zu basteln was sonst eigentlich ja nicht so gut ist (kenn mich noch nicht soooo doll aus wie andere hier)...
Für alle die, dies interessiert, hier weiterlesen:
1. Die Lightbox extension installieren
2. FCE erstellen wobei ein Element vom Typ IMAGE ist
3. XML (Datenstruktur) des FCE's editieren (im List Modul)
4. Unter dem jeweiligen Bild hab ich noch gleich eine Bildbeschreibung (div) gemmapt. Wird jetzt also ein neues Bild Element angelegt, wählt man Bild aus und gibt dazu eine Bildbeschreibung ein. Diese Bildbeschreibung wird dann beim Bild wie folgt als alt- und title-Tag eingefügt (Zeile 19 + 20 beachten):
--> Auszug aus dem XML File field_image
<field_image type="array">
<tx_templavoila type="array">
<title>Image to enlarge</title>
<sample_data type="array">
<numindex index="0"></numindex>
</sample_data>
<etype>image</etype>
<typoscript><![CDATA[
10 = IMAGE
10.file.import = uploads/tx_templavoila/
10.file.import.current = 1
10.file.import.listNum = 0
10.file.maxW = 212
10.imageLightbox2 = 1
10.file.imageLightbox2maxW = 800
10.file.imageLightbox2maxH = 600
10.titleText.field = field_imagedescription
10.altText.field = field_imagedescription
]]></typoscript>
</tx_templavoila>
<tceforms type="array">
<config type="array">
<type>group</type>
<internal_type>file</internal_type>
<allowed>gif,png,jpg,jpeg</allowed>
<max_size>1000</max_size>
<uploadfolder>uploads/tx_templavoila</uploadfolder>
<show_thumbs>1</show_thumbs>
<size>1</size>
<maxitems>1</maxitems>
<minitems>0</minitems>
</config>
<label>Image to enlarge</label>
</tceforms>
</field_image>
Das der Alt- und Titletext wird aus dem Feld field_imagedescription (heisst bei mir so) geholt.
Durch
10.imageLightbox2 = 1
wird die Lightbox Extension für die Bilder in diesem Feld aktiviert.
Mit
10.file.imageLightbox2maxW = 800
definiert man die max Breite die man in der Lightbox haben will.
--> Weitere Optionen in der Lightbox Doku nachlesen...
Soweit so gut, das hätte wahrscheinlich jeder noch selber auf die schnelle hingekriegt.
Das Problem ist jedoch (oder wars zumindest bei mir):
-Dass die Extension keinen validen XHTML 1.0 Code liefert
-In der Lightbox wurde bei mir keine Bildbeschreibung angezeigt (ich wollte dass der title- oder alt-Tag als Bildbeschreibung verwendet wird)
-Überdimensional grosse Bilder wurden zwar in der Lightbox korrekt 800x600 dargestellt wie ich das wollte, aber bei klick auf den Speichern-Button konnte ich lediglich das verkleinerte Bild (in 800x600) downloaden anstatt in voller Auflösung.
das hab ich wie folgt geändert (aber achtung dadurch gehen die Konfigurationsmöglichkeiten per TS für diese Extensions teilweise verloren):
5. Backup vom File /typo3conf/ext/kj_imagelightbox2/class_ux_tslib_content.php machen
6. danach selbiges file öffnen
7. unten an
function cImage($file,$conf) {
$info = $this->getImgResource($file,$conf['file.']);
folgenden Code anfügen
$origFileT = $info[origFile];
$captionT = $this->getAltParam($conf);
if(strpos($captionT, 'alt="')){
$test = substr($captionT, strpos($captionT, '"')+1);
$captionT = substr($test, 0, strpos($test, '"'));
}
danach zur zeile
// create the imagelink
$theValue = '<a href="'.htmlspecialchars($GLOBALS['TSFE']........
springen (bei mir inkl. neuem Code Zeile 197) kopieren und 1 zeile weitere unten wieder einfügen. Zeile 197 dann Auskommentieren.
nun werden nicht XHTML konforme Tags enfernt (showNumberDisplay, id und kjtag)
id=" this-="">singleCaption.'" showNumberDisplay="'.$hideNumberDisplay.'" kjtag="'.$imageToolbar.''.($this->data['tx_kjimagelightbox2_presentationmode'] ? '' : $cap[$this->singleCaption]).'"
die genannte Kacke aus der kopierten Zeile rausschmeissen...
sodele und jetzt diesen Teil der Zeile
rel="lightbox'.$imgSet.'"
mit
rel="lightbox[imageSet]"
ersetzen damit man in der Lighbox auch schön zwischen den Bildern zappen kann.
Nachher
title="'.$cap[$this->singleCaption].'"
mit
title="<a target="_blank" href="'.htmlspecialchars($GLOBALS['TSFE']-">absRefPrefix.t3lib_div::rawUrlEncodeFP($origFileT)).'"><img border="0" title="Bild speichern" src="typo3conf/ext/kj_imagelightbox2/lightbox/images/save.gif" alt="" /></a> '.$captionT.'"
ersetzen (alles in 1 Zeile). Im letzten schritt hab ich (damit ich im JS nicht gross was ändern musste) den "bild speichern" button (zum Original Bild in voller Auflösung) in den title Tag setzen müssen, was aber laut w3.validator.org noch valide zu sein scheint. Weiter werden auch die Bildbeschreibung in den title-tag geschrieben.
8. und letzter schritt:
JS lighbox.js im Verzeichnis lighbox/js/ der Ext öffnen und die Zeile
imageArray.push(new Array(imageLink.getAttribute('href'), imageLink.getAttribute('kjtag')));
suchen und durch
imageArray.push(new Array(imageLink.getAttribute('href'), imageLink.getAttribute('title')));
ersetzen. Und zu guter letzt noch Zeile
imageArray.push(new Array(anchor.getAttribute('href'), anchor.getAttribute('kjtag')));
suchen und durch
imageArray.push(new Array(anchor.getAttribute('href'), anchor.getAttribute('title')));
ersetzen
Und nun, sollte es meiner Meinung nach auch bei euch funktionieren, ohne dass ihr euch noch gross den #angry# zerbrechen müsst.
Ich hoffe es hat einigen was gebracht und funktioniert...
Grüsse aus der Schweiz 8-)