Bildergalerien mit WordPress an einem einfachen Beispiel mit dem Plugin NextGEN Gallery: Vortrag beim WordPress Meetup Hannover http://www.wpmeetup-hannover.de/ am 11.03.2014

1. WordPress mit NextGEN Gallery
Vortrag beim WordPress Meetup Hannover am 11.03.2014

2. Plugin NextGEN Gallery: Kurzportrait
• http://wordpress.org/plugins/nextgen-gallery/
• Äußerst populär, bewährt, kostenlos, erweiterbar
• In 2012 aufgekauft von Photocrati (Foto-Theme Hersteller)
• Enthält Vollbild-Zoom (Lightbox mit J-Query) und Slideshow
mit Varianten, ausführlichen Dialog zum Einfügen, Sammel-
Upload, Passwortschutz, Wasserzeichen-Einfügung, Kleinbild-
Beschneidung, Paginierung, Bildunterschriften, Paginierung,
Galerien in Alben zusammenfassen u.a.m.
• Pro-Version für 39 USD mit interessanten Zusatzfunktionen,
Vorlagen u.a.m. wie Gestensteuerung auf Mobilgeräten

3. Installation und Integration
• Die Installation erfolgt klassisch über
Plugins>Installieren
• Eine neue eigene Menüsektion Gallery
ermöglicht Verwaltung von Galerien, Alben, Tags
und Einstellungen
• Die Editor-Werkzeugleiste wird erweitert um
einen neuen Button für das Einfügen einer
Galerie in den Haupttext von Artikeln/Seiten
(es gibt auch ein Plugin als Erweiterung für die
Verwendung von Shortcodes)

4. Bilder vorbereiten
• Grundsätzlich braucht man Bilddateien im Format
JPG, PNG oder GIF nicht vorbereiten. Es kann
jedoch praktisch sein, z.B.
– Bilder mit verschiedenen Seitenverhältnissen vorher
auf ein einheitliches Format zu beschneiden, um
mögliche Probleme und Unschönheiten mit der
automatischen Beschneidung und gleichmässigen
Darstellung der Kleinbild-Kacheln zu vermeiden.
– bei größeren Bildmengen vorher eine numerische
Reihenfolge in den Dateinamen abzubilden, um die
Galerie dann automatisch danach sortieren zu lassen.

5. Erstellen einer neuen Galerie
• Eine Galerie während des Einfügens in den Haupttext (s.u.) erstellt werden – oder vorher:
Menüsektion Gallery > Add Gallery / Images:
Create a new gallery: internen Namen der Galerie festlegen
• Klassischer Upload per Add Files: Hochladen von Bilddateien über eigenen Dateimanager
• Alternativ aus dem Dateimanager eine oder alle markierten Bilddateien in den darunter
liegenden Bereich ziehen (Drag image and ZIP files here or click Add Files):
Die Dateien werden sukzessive mit Name und Größe aufgelistet: Hochladen mittels Klick auf
Start Upload. Die Übertragung kann eine Weile dauern und der Verlauf wird angezeigt.
Danach ist die Galerie fertig erstellt und muss nur noch veröffentlicht werden.

6. Einfügen einer Galerie: Typ wählen
• Ein überlagerter Bildschirmdialog führt schrittweise durch die
Einstellungen und bietet zudem alle Verwaltungsebenen der
Menüsektion (außer Einstellungen)
• Der Typ „NextGEN Basic
Thumbnails“ ist die
klassische Galerie mit
Kleinbilder-Kacheln

7. Einfügen einer Galerie: Galerie wählen
• Aus den über das Plugin verwalteten Galerien
(Galleries) eine auswählen. (Alternativ über
Add Gallery / Images neue Galerie anlegen.)
7

8. Einfügen einer Galerie: Anzeige-Einstellungen
Vereinfachtes Beispiel:
• Die Größen der von WP
errechneten Kleinbilder
übergehen (Option override: Ja)
und eigene (custom) maximale
Abmessungen (dimensions)
passend zum eigenen Layout
festlegen.
• Zuschneiden, Wasserzeichen,
Paginierung, Slideshow usw.
abschalten mit Option Nein
• Zweispaltige Darstellung der
Kleinbild-Kacheln:
Number of columns to display: 2
8

9. Einfügen einer Galerie: Aus/sortieren
• Voreinstellung der Sortierung möglich in der Menüsektion Gallery
unter Other Options bei What's the default sorting method?
• Beim Einfügen einer Galerie kann man eine abweichende
automatische Sortierung festlegen oder eine spezielle manuelle
Sortierung vornehmen sowie einzelne Bilder aussortieren, was
dann nur für die Anzeige der einen eingefügten Galerie gilt:

10. Veröffentlichen
• Abschließend muss im Dialogfenster nur ie auf
„Save“ geklickt werden, um das Einfügen
abzuschließen.
• Das Speichern der Seite erfolgt wie üblich mit
Klick auf „Veröffentlichen“ bzw. „Aktualisieren“.
• Eine symbolische Fläche im Editor repräsentiert
die eingefügte Galerie, um sie jederzeit im Editor
verschieben oder per Klick weiter verändern zu
können.

11. Beispiele für erweiterte Anwendungen
aus Projekten von TRILOS
AWO Residenzen, Multisite, theme Simplemarket by WPMU: Galerien für Slider des themes im Seitenkopf
www.aworesidenz-gehrden.de www.aworesidenz-langenhagen.de www.aworesidenz-sehnde.de

12. Tagungsstätte Loccum: custom theme, drei per Klick wechselnde
Bilder im Seitenkopf www.tagungsstätte-loccum.de
WordPress mit NextGEN Gallery - Vortrag
beim WordPress Meetup Hannover am
11.03.2014
12

13. Archiv Kuriosum
www.archiv-kuriosum.de
theme The Erudite
by somadesign.ca,
1.000 Bilder,
93 Galerien,
Besonderheit:
Schriftgrafik-Galerie als
Adaption eines
experimentellen Buches:
13

14. STEP Hannover: www.step-hannover.de
custom theme, Galerie mit Kleinbild-Laufband zum Anklicken
WordPress mit NextGEN Gallery - Vortrag
beim WordPress Meetup Hannover am
11.03.2014
14

15. Verweise
• Bezugsquelle im WordPress Plugin Directory:
http://wordpress.org/plugins/nextgen-gallery/
mit Links auf die eigene Website
http://www.nextgen-gallery.com/ und
Support, Dokumentation, Übersetzungen u.a.
• Viele Plugins mit Erweiterungen (derzeit 175)
sind i.d.R. mit dem Suchwort NextGEN
auffindbar.

16. Danke für die Aufmerksamkeit.
Erik Petersen
petersen@trilos.de
TRILOS new media
Inh. Erik Petersen
Hanomaghof 2
30449 Hannover
tel 0511 214498-60
fax 0511 214498-65
Internet-Auftritte, CMS, Hosting uvm.
- mehr dazu auf www.trilos.de
http://gplus.to/trilos
https://www.facebook.com/trilos.it
https://www.twitter.com/trilos
https://www.xing.com/hp/Erik_Petersen2
http://www.linkedin.com/in/erikpetersen2
WordPress mit NextGEN Gallery - Vortrag
beim WordPress Meetup Hannover am
11.03.2014