imageTweak als Fotoalbum verwenden

Für ein Systemtool wie imageTweak, das vollautomatisch alle Bilder auf Ihrer Website optimieren kann, ist es kein Problem quasi im Vorbeigehen ein Fotoalbum aus allen Bildern eines beliebigen Verzeichnis zu erstellen.
Dieser Tipp zeigt Ihnen wie es funktioniert.
Was benötigen Sie dafür?
- imageTweak ab Relase 0.50
- jQuery Fancybox muss verfügbar sein
Falls Sie die jQuery Fancybox bereits eingebunden haben, können Sie den folgenden Abschnitt überspringen.
Installation der jQuery Fancybox
Die folgende Beschreibung bezieht sich auf die Installation unter LEPTON CMS, unter WebsiteBaker ist der Ablauf jedoch identisch.
Installieren Sie bitte zunächst die folgenden Add-ons von Bianka Martinovic (Webbird)
- wblib - Funktionsbibliothek
- LibraryAdmin - Verwaltung von Funktionsbibliotheken wie jQuery, MooTools etc.
- lib_jquery - jQuery Basisbibliothek
imageTweak bringt ein vorkonfiguriertes Preset für die Einbindung der Fancybox mit. Dieses Preset wird von LibaryAdmin automatisch erkannt und direkt zur Verfügung.
Wenn Sie Voreinstellungen für die Fancybox ändern möchten, rufen Sie innerhalb von LibraryAdmin die jQuery Bibliothek auf und wählen auf der linken Seite unter
Module Folders ⇒ image_tweak ⇒ fancybox
das Preset zum Bearbeiten auf.
Damit die Fancybox aktiv ist, muss sie noch auf Ihrer Website eingebunden werden. Dies geschieht, in dem Sie den Aufruf für das Preset entweder an einer beliebigen Stelle in einer WYSIWYG Section oder aber im Template Ihrer Website einbinden (dort dann unmittelbar vor dem schließenden </body> Tag):
[[LibInclude?lib=lib_jquery&preset=fancybox&module=image_tweak]]
Damit ist die Fancybox einsatzbereit und kann von imageTweak genutzt werden.
Weiterführende Informationen und Beispiele für die vielfältigen Einsatzmöglichkeiten des LibraryAdmin finden Sie im LibraryAdmin Showroom.
Ein Fotoalbum mit imageTweak anzeigen
Zunächst einmal benötigen Sie ein Verzeichnis, in dem sich die gewünschten Bilder oder Fotos befinden. Im Folgenden Beispiel gehe ich davon aus, dass sich die Bilder, die angezeigt werden sollen im /MEDIA Ordner und dort im Verzeichnis /fotoalbum befinden.
Kopieren Sie mit Hilfe des Medien Dateimanager die gewünschten Bilder bzw. Fotografien in den den Ordner /fotoalbum. Die Größe der Bilder spielt hierbei keine Rolle, imageTweak wird sowohl die vergrößert dargestellen Bilder (Zoom) als auch die Vorschaubilder automatisch optimieren und die Dateigrößen effektiv verringern.
Anschließend fügen Sie an der gewünschten Stelle in in Ihrer WYSIWYG Section (in dem Artikel oder Bericht, dem Sie ein Fotoalbum hinzufügen möchten) den Funktionsaufruf für das Fotoalbum ein:
[[it_gallery?folder=fotoalbum]]
Das verwendete Droplet it_gallery kennt lediglich zwei Parameter:
- folder - gibt den Ordner im /MEDIA Verzeichnis an, der angezeigt werden soll.
- width - gibt die Breite des Titlebild in Pixel für das Fotoalbum an
Das Beispielalbum verwendet eine Breite von 400 Pixeln:
Der vollständige Aufruf für das Beispiel lautet:
[[it_gallery?folder=fotoalbum&width=400]]
Mit einem einzigen Befehl binden Sie also eine vollständige Galerie ein (engl.: Folder Gallery).
Sie hätten gerne kurze Beschreibungen unter den Bildern stehen?
Auch das geht. Bitte legen Sie mit einem Texteditor eine neue Datei an (unter Windows klicken Sie auf Start und geben im Durchsuchen Feld "Notepad" ein).
- Beginnen Sie, in dem Sie den Dateinamen eines der Bilder aus dem Fotoalbum eintippen,
- tragen Sie an den Dateinamen anschließend ein Pipe Symbol ein (auf der Tastatur oberhalb der Windows Taste)
- daran anschließend tragen Sie die gewünschte Beschreibung für dieses Bild ein.
- Geben Sie eine neue Zeile ein und wiederholen Sie den Vorgang für das nächste Bild
Speichern Sie die Datei als images.lst ab. Achten Sie bitte darauf, dass Sie die Datei im UTF-8 Format sichern (nicht ANSI)!
Übertragen Sie die Datei images.lst anschließend in den /MEDIA Ordner, der ihr Fotoalbum enthält - fertig!
Die Beschreibungsdatei für das o.a. Fotoalbum:
255088_R_B_by_RainerSturm_pixelio.de.jpg|Das "um den Baum herum" Haus ...
413552_R_K_B_by_Markus-Wegner_pixelio.de.jpg|Gelbe Farbtube
ap4ad7e8f0bacc6_medium.jpg|Baukräne in Berlin
ap4ad80309c84fc_medium.jpg|Das Brandenburger Tor
ap_27248_Prinz_2.jpg|Der Briefmarken-Befeuchter-Frosch
ap_30067_IMG_4462_2.jpg|Alter Schaltkasten
ap_31903_silbersee_088_1_2.jpg|Das Vorhängeschloß
ap_35786_schrauben.jpg|Schrauben, Schrauben ...|true
Jens Zehnder 1.jpg|Mischpult
Sie hätten gerne, dass ein bestimmtes Bild als Titelbild angezeigt wird?
Setzen Sie in der Datei images.lst hinter die Beschreibung des betreffenden Bildes ein Pipe Symbol und tragen sie true ein. Damit haben sie dieses Bild als Titelbild festgelegt.
Diese Dokumentation ist sicherlich noch nicht vollständig, bitte helfen Sie mit Fehler zu beheben und fehlende Hinweise zu ergänzen.
![]()
Ralf Hertsch, 12.11.2011

