Bilderwelten

Teil 2: Skripte für Fotogalerien

Die Typo-3-Erweiterung Flow Gallery kann Fotos in mehreren Ansichtsmodi präsentieren. Zur Auswahl stehen unter anderem die Einzelbild- oder Miniaturansicht (Thumbnail View) und die aus Apple iTunes bekannte und ästhetisch besonders gelungene Coverflow-Ansicht.

Die Bilder und Galerien werden über Datenbankeinträge im Typo-3-Backend gesteuert. Um den Umgang mit umfangreichen Bildergalerien effizient zu gestalten, kann man ganze Bilderverzeichnisse importieren.

Einzelne Fotos lassen sich nachträglich mittels des Befehls crop beschneiden. Die Flow Gallery ist im Flash-Standard umgesetzt und bezieht die Daten aus einem XML-Dokument gemäß dem RSS 2.0-Standard.

Web-Fotogalerien für Plone

Auch für Plone gibt es einige interessante Lösungen, darunter Plone Image Repository und Plone True Gallery. Beide Plug-ins stützen sich auf die Kupu-Bibliothek.

Fotogalerie-Skripte

© Archiv

Eine Coverflow-Ansicht realisiert das Wordpress- Plug-in Next GEN Imageflow.

Plone Image Repository erlaubt die Katalogisierung von Galeriebildern anhand der Schlüsselworte oder des Datums. Diese Erweiterung adressiert nur einen Teilaspekt von Web-Bildergalerien, nämlich die Katalogisierung.

Plone True Gallery ist eine umfassendere Lösung mit Unterstützung für die Dienste Flickr und Picasa. Plone True Gallery kommt sehr gut auch mit verschachtelten und vor allem mit umfangreichen Galerien zurecht, da die Bilder dynamisch (statt alle auf einmal) geladen werden.

Einige andere interessante Projekte, darunter Olha Pelishoks Round About für 360-Grad-Panoramabilder, befinden sich erst in einem experimentiellen Entwicklungsstadium, sind aber schon jetzt einen intensiveren Blick wert.

Bei der Installation der Plone True Gallery sollte man die Abhängigkeit vom simplejson 2.07 beachten. Es handelt sich hierbei um einen schnellen, gut erweiterbaren JSON-Encoder/Dekoder für Python 2.4. Damit ist also automatisch die Abhängigkeit von Python ab Version 2.4 gegeben, was aber dem Ziel angemessen erscheint.

Zu den besonderen Pluspunkten von simplejson 2.07 zählt die Tatsache, dass sich der JSON-Encoder/Dekoder optional auch über C-Bibliotheken ansteuern lässt und man so kompilierbare Routinen erhält, die noch schneller ablaufen.

JSON für Plone True Gallery

Bei JSON, der sogenannten Javascript Object Notation, handelt es sich um ein schlankes Datenauschformat, eine Untermenge der Javascript-Programmiersprache gemäß dem ECMA-262. Das Format lässt sich von Menschen lesen und kann durch Software zeilenweise interpretiert und automatisch erzeugt werden.

Da es sich hierbei um eine Untermenge der Javascript-Programmiersprache handelt, lernt man mit JSON eine nicht-proprietäre Technologie, die sich zudem crossplattform nutzen lässt.

Die von JSON verwendeten Datenstrukturen sind universell und lassen sich immer auf die eine oder andere Weise implementieren. Es liegt natürlich nahe, dass ein Datenaustauschformat, welches moderne Programmiersprachen unterstützt, auch leicht in diesen abgebildet werden kann. Und das ist bei JSON eben der Fall.

Ozio Gallery 1.08 für Joomla

Mit der Ozio Gallery 1.08 steht Joomla-Anwendern eine beeindruckend vielseitige Erweiterung zur Verfügung.

Zwar handelt es sich bei Ozio Gallery eigentlich nur um eine Web-Bildergalerie, doch stellt diese mindestens zehn verschiedene Skins bereit, die das Aussehen der Galerie dramatisch verändern: Skin Tilt, Skin Flickr Slideshow, Skin Flickr Photos, Skin Image Rotator, Skin lust Mosaico, Skin Slideoo, Skin Accordion, Skin Flash Category, Skin Flash Gallery und Skin Carousel.Auf diese Weise bringt man verschiedene Geschmacksrichtungen unter einen Hut.

Next GEN für Wordpress

Benutzer der beliebten Blog-Software Wordpress haben verschiedene Lösungen zur Verfügung, die teilweise aufeinander aufbauen. Zu den interessantesten zählt Next GEN Gallery, ein Wordpress-Plug-in zur Bereitstellung von Web-Fotogalerien mit einer optionalen Flash-Slideshow.

Ein einfaches Administrations-Backend erlaubt die Verwaltung mehrerer Galerien pro WP-Installation. Beim Anklicken einer Bildminiatur wird eine Detailansicht des betreffenden Fotos vor einem grauen Hintergrund präsentiert.

Ein einfaches Administrations-Backend erlaubt die Verwaltung mehrerer Galerien pro WP-Installation. Beim Anklicken einer Bildminiatur wird eine Detailansicht des betreffenden Fotos vor einem grauen Hintergrund präsentiert.

Next GEN Flash Viewer für Next GEN Gallery erlaubt die Umsetzung der berühmten Plug-ins Simple Viewer, Tilt Viewer, Auto Viewer und Postcard Viewer von Airtight Interactive in Wordpress.

CSS Play

Nach all diesen Web-Bildergalerien, wo spezielle Skripte zum Einsatz kamen oder die Anbindung an bestimmte CMS-Systeme wie Plone oder Joomla im Vordergrund stand, folgt nun mit der Vorstellung von CSS Play eine reine CSS-Lösung. Berücksichtigt man die verschiedenen Versionen des Designs, so bekommt man mit CSS Play eine ganze Sammlung CSS-basierter Vorlagen für Bildergalerien.

Außer CSS kommt in einigen Fällen Javascript zum Einsatz, und zwar die jQuery-Javascript-Library von Google ().

Wer eine rein CSS-basierte und sogar Javascript-freie Lösung wünscht, die sich auch noch gemäß den W3C-Richtlinien als fehlerfreies CSS validieren lässt, hat zu CSS Play nicht allzu viele Alternativen zur Auswahl.

Der Autor erlaubt die Nutzung von CSS Play auch in kommerziellen Projekten, solange man die Hinweise auf ihn in den Quelltexten belässt und seine Arbeit mit einer Spende an den Fund Support CSS Play würdigt.

Highslide JS

Wer einer CSS-Lösung lieber eine Javascript-basierte Galerie vorzieht, dürfte an der Open-Source-Software Highslide JS seine Freude haben. Mit einem einzigen Klick kann man das gewünschte Bild anwählen. Nach dem Öffnen des Bildes oder des HTML-Popups kann der Websitebesucher weiter in der Web-Bildergalerie scrollen.

Fotogalerie-Skripte

© Archiv

Eine Javascript-freie Version der CSS-basierten Galerie CSS Play.

Zu den Highlights von Highslide JS zählt die Verfügbarkeit des Highslide Configurators ().

Mithilfe des Highslide Configurators kann man die drei verfügbaren Routinen Highslide JS Core,With Gallery und With HTML an die eigenen Bedürfnisse anpassen. In der Highslide JS core-Routine kann man unter anderem mit der Option Autosize die Größe automatisch wählen, Bilder mit der Option Preload images automatisch vorab laden, um die Darstellungsgeschwindigkeit zu maximieren, ein Image-Map zur Verfügung stellen, nützliche Navigationshilfen einblenden und vieles mehr.

Im Vergleich zur kompletten Bibliothek Highslide JS core gibt sich die ebenfalls wählbare Variante With Gallery bewusst schlicht. Man hat eine Art Mini-Web-Bildergalerie, die den Hintergrund wegdimmt. Hierzu kommen die Routinen Slideshow und Transitions zum Einsatz. Wer diese Lösung vorzieht, kann im Highslide Configurator mittels Advanced positioning dennoch auf erweiterte Positionierungsfunktionen zugreifen.

Und schließlich kann man auch mit der Routinensammlung With HTML auch HTML, AJAX, dynamisches AJAX, inline-HTML und Flash rendern. Highslide JS glänzt mit einer Funktionalität, die man sonst nur in kommerziellen Lösungen findet.

Fazit

Wer CMS-gesteuerte Websites betreibt, findet in der Flow Gallery eine gangbare Lösung für Typo 3. Plone-Anwender können unter anderem zur Plone True Gallery greifen. Joomla-Nutzer bekommen mit der Ozio Gallery eine sehr flexible und ausgereifte Lösung.

Wer keine Anbindung an ein CMS benötigt, kann auch Desktop-Software wie Adobe Photoshop, Adobe Lightroom 2.2, Apple Aperture 1.2.1 oder Google Picasa einspannen, um ganze Bildersammlungen in eine schlüsselfertige HTML- oder Flash-basierte Web-Fotogalerie zu exportieren. Insbesondere bewähren sich in diesem Fall die ohnehin beliebten Lösungen von Airtight Interactive.

Wer eine manuelle Konfiguration per Texteditor nicht scheut, hat noch eine wesentlich größere Auswahl zur Verfügung. Mit kostenlosen Vorlagen für Bildergalerien wie CSS Play kann man durchaus ansprechende Resultate erzielen. Wer sich lieber auf Javascript verlassen möchte, dürfte in Highslide JS das Werkzeug seiner Wahl finden.

Mehr zum Thema

Youtube Sperre umgehen GEMA
Videos freischalten

So umgehen Sie die GEMA-Sperre bei Youtube. Was Sie dazu brauchen, und wie es am einfachsten geht.
Neue Fritzboxen unterstützen den AC-Standard.
WLAN-Geschwindigkeit verdoppeln

Mehr WLAN-Geschwindigkeit: Mit dem WLAN-Standard 802.11ac und den richtigen Geräten und Einstellungen verdoppeln Sie den Datendurchsatz.
Netflix auf dem TV
Programm in der Übersicht

Welche Filme und Serien gibt es bei Netflix eigentlich zu sehen? Was ist neu im Streaming-Angebot? Diese Antworten helfen weiter.
Netflix
Streaming

Preise, kompatible Geräte, Datenrate, Serien- und Filmangebot von Netflix: Wir beantworten die wichtigsten Fragen rund um den Streaming-Dienst.
E.T. – Der Außerirdische
Vorschau auf Film- und Serien-Highlights

Amazon Prime Instant Video lockt im Dezember 2016 mit Film-Highlights wie "E.T.", "Fast & Furious 7" und der Serie "Ku’damm 56​".