Geschrieben von ersatzspieler am 23.08.2009 um 23:57:
Ansicht der Dateianhänge
Ich habe mal wieder eine neue Kleinigkeit die vielleicht auch noch andere wbb2 Besitzer Gebrauchen können.
Es handelt sich um eine sogenannte Lightbox.
Wenn man die Grafik des Dateianhanges anklickt geht nicht wie normal eine neues Fenster auf wo dann das Bild zu sehen ist sondern das aktuelle Fenster verdunkelt sich und zeigt nur noch das Bild klar.
Es werden sämtliche Dateianhänge geladen die sich auf der Seite des jeweiligen Themas befinden, wenn man dann ein wenig mit der Maus über das geladene Bild geht tauchen an den Seiten des Bildes dann Links auf wo man zwischen den einzelnen Bildern wechseln kann.
Der Einbau
Backup machen!!!
Als erstes muss sich die .zip Datei vom programmierer geholt werden, klicke auf den folgenden Link. Ein wenig runter scrollen und dann auf Download.
Lightbox v2.04
http://www.huddletogether.com
Datei entpacken und die Ordner auf deinen Webspace laden, natürlich in den selben Ordner wo auch dein Forum liegt.
Die index.html NICHT mit hochladen!
Nun gehe in dein ACP --> Templates bearbeiten --> headinclude
SUCHE :
Füge DARÜBER: EDIT: In der Lightbox v2.04 gilt ein neuer Code, habe ihn hier angepasst.
| code: |
1:
2:
3:
4:
5:
|
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" /> |
|
Speichern.
Bei folgenden Template gehe ich von einem nicht bearbeitet template aus, solltet ihr das Template schon bearbeitet haben müsst ihr es dementsprechend anpassen. Es muss nur etwas im a TAG geändert werden.
Öffne nun das thread_attachmentbit_show_thumbnail template und ersetze den Inhalt mit folgendem:
| code: |
1:
|
<a href="attachment.php?attachmentid=$attachment[attachmentid]{$SID_ARG_2ND}" rel="lightbox[roadtrip]"><img style="padding-bottom: 3px;" src="attachment.php?attachmentid=$attachment[attachmentid]&thumbnail=1{$SID_ARG_2ND}" border="0" /></a> <if($thumbnailNewline)><then><br /></then></if> |
|
Speichern.
Solltet ihr mehr als einen Style haben und in den anderen Styles sind die oben genannten Templates vorhanden müssen auch diese angepasst werden.
Fertig.
Freuen.
Viel Spass mit !!!
Geschrieben von ersatzspieler am 24.08.2009 um 00:05:
mal probiert zu übersetzen hoffe das Hilft Usern die nicht so mit Englich am Hut haben !
So verwenden Sie:
Teil 1 - Setup
1. Lightbox v2.0 nutzt das Prototype Framework und Scriptaculous Effects Library. Sie benötigen, um diese drei Javascript-Dateien in Ihrem Kopf.
<script type="text/javascript" src="js/prototype.js"> </ script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"> </ script>
<script type="text/javascript" src="js/lightbox.js"> </ script>
2. Fügen Sie die Lightbox CSS-Datei (oder fügen Sie Ihre aktive Stylesheet mit der Lightbox styles).
<link rel="stylesheet" href="css/lightbox.css" type="text/css" /> media="screen"
3. Überprüfen Sie die CSS und stellen Sie sicher, dass die betroffene prevlabel.gif und nextlabel.gif Dateien werden in die richtige Lage. Also, stellen Sie sicher, dass die loading.gif und closelabel.gif Dateien als in der Nähe, auf der Spitze des lightbox.js Datei in die richtige Lage.
Teil 2 - Aktivieren
1. Add a rel = "lightbox" Attribut zu jedem Link-Tag, um die Lightbox. Zum Beispiel:
<a href="images/image-1.jpg" rel="lightbox" title="my caption"> Bild # 1 </ a>
Optional: Mit dem Titel-Attribut, wenn Sie wollen zeigen, eine Beschriftung.
2. Wenn Sie eine Reihe von Bildern, die Sie möchten Gruppe, folgen Schritt, aber zusätzlich auch eine Gruppe Name in eckigen Klammern in den Attribut rel. Zum Beispiel:
<a href="images/image-1.jpg" rel="lightbox[roadtrip]"> Bild # 1 </ a>
<a href="images/image-2.jpg" rel="lightbox[roadtrip]"> Bild # 2 </ a>
<a href="images/image-3.jpg" rel="lightbox[roadtrip]"> Bild # 3 </ a>
Keine Grenzen für die Anzahl der Bilder pro Seite legt, oder wie viele Bilder sind in jedem Satz. Go Nüsse!