Jquery lightbox in OXID

Deutsches Forum
1

Hi,
hat jemand von euch eine lightbox in oxid eingebaut?
Könnt ihr mir viellicht sagen wie ich das einbaue?

danke
Grüße

2

Würde mich auch interessieren … :wink:

3

Hallo,

wenn es um diese Lightbox geht, http://www.huddletogether.com/projects/lightbox2/
dann einfach die js-Dateien in _header.tpl oder details.tpl einbinden.
Vorher die Bildfade in der lightbox.js anpassen und in der details.tpl dann dafür sorgen, dass nur das erste Bild für die Lightbox sichtbar ist. Dafür könnte folgender Code hilfreich sein


[{if $oView->showZoomPics() }]
  [{assign var="iImgNr" value="1"}]
  [{assign var="sIndex" value="ZoomPics" }]
  [{assign var="aZoomPics" value=$product->getPictureGallery() }]
  [{assign var="aZoomPics" value=$aZoomPics[$sIndex] }]
  [{assign var="iZoomPic" value=$oView->getActZoomPic() }]
  [{assign var="sClass" value="" }]
  [{if $aZoomPics|@count > 1}]
    [{foreach from=$aZoomPics item=_zoomPic}]
       <a href="[{$_zoomPic.file}]" rel="lightbox[group]" [{$sClass}]>[{ oxmultilang ident="DETAILS_PERSPARAM_ZOOM" }]</a>
       [{assign var="iImgNr" value=$iImgNr+1}] 
       [{if $iImgNr > 1}][{assign var="sClass" value="style=display:none;" }][{/if}]
     [{/foreach}]
   [{else}]
     <a href="[{$aZoomPics[$iZoomPic].file}]" rel="lightbox">[{ oxmultilang ident="DETAILS_PERSPARAM_ZOOM" }]</a>
   [{/if}]
[{/if}]

Der Code ist abgewandelt und entspricht nicht dem Original in der details.tpl
Zusätzlich muss dann noch der CSS-Teil in die oxid.css eingebunden und den Bedürfnissen angepaßt werden. TMP-Ordner leeren und Seit neuladen.
Hinweis: Werden andere jquerymodule eingebunden, dann kommt es zu Fehlern mit der lightbox2. In dem Fall eine reine jquerylightbox einbauen. Vorgehensweise ist dieselbe

4

Super, klingt ja eigentlich nicht großartig aufwändig. Werd das mal testen bzw. mich mal 'n bisschen spielen. Besten Dank schonmal!

5

Vielen Dank das funktioniert sehr gut auch in der 4.5.1 mit dem Basic Theme. Einzig der verweis auf die Sprachdatei muss angepasst werden.
Statt der Lightbox habe ich die Slimbox genommen. Ist das gleiche nur wesentlich schlanker.

Gibt es vielleicht auch folgende Möglichkeit.

Wenn man mehrere Artikel Bilder hat wird, wenn man eines der Thumbs anklickt, das Bild erst oben als Hauptbild geladen. Erst wenn man danach auf „zoom“ klickt kommt man in die Lightbox.
Schön wäre es wenn man durch anklicken auf eines der Thumbs direkt in die Lightbox kommt.