Online Photo Gallery

Mit Hilfe des einfach zu installierenden CMS Made Simple Moduls „Album“ kannst Du bequem eine leistungsfähige online Photo Gallery aufbauen. Lade Deine Photos hoch, wähle zwischen den integrierten Templates Deinen Favorit, um die Webseite zu erstellen, und Deine Photo Gallery ist fertig – natürlich kostenlos, wie alles bei CMS Made Simple. Diese Anleitung zeigt Dir, wie es geht, wie Du Dein eigenes Photo Album erstellen kannst.

Eigenschaften des Moduls Album (Photo Gallery)

  • eigene Photo Gallery erstellen und bearbeiten
  • verschiedene Kategorien in der Photo Gallery erstellen
  • bis zu drei Beschreibungen können an jedes Photo angehängt werden
  • mehr als 10 zum Einsatz bereitstehende Templates sind kostenlos dabei, um Deine eigene Photo Gallery zu erstellen
  • Zufallsanzeige der eigenen Photos (Random)
  • kürzlich hochgeladene Photos können extra gekennzeichnet und angezeigt werden

Mehr als 10 verschiedene Templates zur Anzeige Deiner eigenen Photo Gallery stellen wir Dir hier kostenlos zur Verfügung.

Live Photo Gallery mit CMS Made Simple

CMS Made Simple stellt mehrere Möglichkeiten der Anzeige für Deine eigene online Photo Gallery bereit. Damit Du Dir ein Bild über die Möglichkeiten machen kannst, habe ich hier einige schöne Beispiele zusammengestellt, die Du ähnlich auch auf Deiner eigenen Webseite erstellen kannst.

Wenn Du auf den Screenshot klickst, öffnet sich in einem neuen Fenster die Beispielseite. Wenn Du auf den Link unterhalb der Screenshots klickst, siehst Du, wie das original Template für die Photo Gallery in CMSMS jeweils aussieht.

Beispiel, wie die Photo Gallery in CMS Made Simple gestaltet werden kann - Jens Hauschildt Beispiel, wie die Photo Gallery in CMS Made Simple gestaltet werden kann - Jens Hauschildt Beispiel, wie die Photo Gallery in CMS Made Simple gestaltet werden kann - Jens Hauschildt
default Template (Standard) Greybox Template Lightbox Template

Um die Templates im Original für Deine Photo Gallery einzusetzen, benötigst Du keine besonderen Kenntnisse, denn dafür sind die Templates da.

Natürlich sind Deiner Kreativität beim Webseiten erstellen keine Grenzen gesetzt. Die nächsten Beispiele zeigen kostenlose Standard Templates, die den eigenen Bedürfnissen angepasst wurden. Du siehst, dass Du volle Kontrolle über das Aussehen der online Photo Gallery auf Deiner Webseite hast. Für das Anpassen benötigst Du allerdings ein paar HTML Kenntnisse. Aber auch das ist nur halb so schlimm, denn im Internet findest Du mit Sicherheit viele gute Anleitungen, um HTML schnell zu lernen.

Beispiel, wie die Photo Gallery in CMS Made Simple gestaltet werden kann - Jens Hauschildt Beispiel, wie die Photo Gallery in CMS Made Simple gestaltet werden kann - Jens Hauschildt Beispiel, wie die Photo Gallery in CMS Made Simple gestaltet werden kann - Jens Hauschildt
CMotion Template Tables Template Separate Thumbnails Template

Auch hier gestaltet sich die Installation des Moduls Album für die eigene Photo Gallery wieder als Ein-Klick Lösung. Gehe dazu im Admin Panel Deiner CMSMS Webseite auf Erweiterungen --> ModulManager und klicke auf den Reiter „verfügbare Module“. Suche nun das Modul Album und klicke in der selben Zeile auf „Herunterladen und Installieren“. Das Modul Album ist nun installiert und Du kannst sofort Deine Photo Gallery erstellen.

Photos hochladen

Mit Hilfe des Moduls Album kannst Du alle Deine Bilder in einer online Photo Gallery darstellen. Sie liegen auf Deinem Server unter uploads/images und den darunter eingerichteten Unterordnern, so dass Du direkt dort eine saubere Struktur für Dein Album erstellen kannst. Da die Photo Gallery auf diesen Ordner zurückgreift, kannst Du Deine Bilder nicht nur direkt mit dem Modul selbst, sondern auch mit der Bildverwaltung und sogar mit dem FTP Browser FileZilla auf den Server hoch laden.

Um Deine Photo Gallery getrennt von den Bildern, die Du auf den Inhaltsseiten verwendest, verwalten zu können, legen wir einen extra Ordner „album“ an. Gehe hierzu in das Admin Panel Deiner CMS Made Simple Webseite und klicke auf Inhalte --> Bildverwaltung. Schreibe „album“ in das Feld „Neuen Ordner anlegen:“ und klicke auf >>Anlegen<<. Der neue Ordner „album“ ist angelegt. Du kannst bereits jetzt Deine Bilder in diesen Ordner laden, falls es mehrere sind, geht es mit dem FTP Browser FileZilla deutlich schneller.

Tipp: Optimiere die Bilder vor dem Hochladen für die Verwendung im Internet – reduziere die Größe! Bilder, die direkt von der Kamera kommen, sind unbrauchbar. Wenn Du noch kein entsprechendes Programm zur Bildoptimierung hast, empfehle ich Dir die Nutzung des kostenlosen Programms Gimp.

Achtung! Für die Bilder, die per FTP Browser auf den Server geladen werden, werden im Gegensatz zum Hochladen mit der Bildverwaltung, nicht automatisch Thumbnails erstellt. Um sicherzustellen, dass Thumbnails generiert werden, klicke nach dem Upload auf Inhalte --> Bildverwaltung, das ist dann auch schon alles. Die Bildverwaltung erkennt dann die Bilder und erstellt automatisch die später benötigten Thumbnails.

Photo Gallery erstellen

Um Deine erste Photo Gallery nun endlich zu erstellen, gehe im Admin Panel auf Inhalte --> Fotoalbum.

Ein Fotoalbum (Photo Gallery) anlegen in CMS Made Simple - Jens Hauschildt

Klicke hier auf einen der Links „Ein Album hinzufügen“, gebe dem Album im sich öffnenden Fenster einen Namen, z.B. „mein erstes Fotoalbum“ und klicke auf >>absenden<<. Das Fotoalbum ist nun angelegt. Nun werden wir die Fotos in das Album laden. Klicke hierzu am unteren linken Bildrand auf „Bilder hinzufügen“. Auch hier gibt es wieder zwei Links, wobei es unerheblich ist, auf welchen Du klickst.

Im nächsten Fenster siehst Du den Inhalt des Ordners uploads/images Deines Admin Panels inklusive der Unterordner. Um eine saubere Struktur zu erlangen, d.h. um die Bilder, die wir im Inhalt der CMSMS Webseite benötigen von den Photo Gallery Bildern zu trennen, haben wir den Ordner „album“ angelegt. Klicke auf den Ordner „album“ in der Tabellenspalte „Name“. Hier findest Du alle Bilder, die Du hochgeladen hast. In diese Sektion kannst Du auch Bilder einzeln hochladen, wenn Du am unteren Ende der Seite das Feld „Ein Bild hochladen“ nutzt. Für einzelne Fotos ist dieser Vorgang ok – vergesse aber nicht, sie in der Größe und Auflösung zu reduzieren.

Wie Du die Bilder letztendlich auf den Server lädst ist egal. Es macht keinen Unterschied, ob Du die Bildverwaltung, das Modul Fotoalbum oder den FTP Browser nutzt. Ich persönlich lade einzelne Bilder mit dem Fotoalbum, mehrere Bilder mit dem FTP Browser FileZilla hoch, da dies einfach schneller geht. Vergesse nach dem Hochladen mit einem FTP Browser aber nicht, danach die Bildverwaltung aufzurufen, um so automatisch Thumbnails zu erstellen.

Bilder auswähln, die im Fotoalbum (online Photo Gallery) in CMS Made Simple gezeigt werden sollen - Jens Hauschildt

Wähle durch aktivieren der Checkboxen die Bilder aus, die in Deiner Photo Gallery erscheinen sollen. Unterhalb der Auflistung findest Du den Link „alle auswählen“, mit dem Du Dir die Arbeit erleichtern kannst, wenn Du alle dargestellten Bilder in die online Photo Gallery aufnehmen möchtest. Klicke nun rechts unten auf >>speichern<<. Alle ausgewählten Bilder sind nun dem Fotoalbum „mein erstes Fotoalbum“ zugeordnet.

Um nun die Bilder auch tatsächlich auf einer Seite zu sehen, erstelle eine neue Inhaltsseite unter Inhalte --> Seiten --> neue Seiten hinzufügen. Schreibe in das Feld „Content:“ den folgenden Smarty Tag:

{cms_module module="Album"}

Benenne nun Titel und Menütext (z.B. mit „Fotoalbum“) und klicke auf >>absenden<<.

Kontrolliere nun das Ergebnis in Deinem Internet Browser. Im Navigationspunkt Fotoalbum findest Du einen Thumbnail Deiner Photo Gallery „mein erstes Fotoalbum“. Wenn Du weitere Alben generierst, stehen sie neben dieser ersten. Öffne das erste Fotoalbum durch Klick auf den Thumbnail. Auf der Webseite erscheinen nun alle Bilder, die Du dieser Gallery zugewiesen hast als Thumbnail. Bei Klick öffenen sie sich und Du kannst bequem durch sie navigieren.

Die Bilder tragen, sofern Du sie noch nicht umbenannt hast, die kryptischen und unschönen Namen, die ihnen direkt von der Kamera vergeben wurden. Um ihnen schöne Namen, wie z.B. „Stadttor von Zons“ anstatt von „img15364.jpg“, zu vergeben, gehe im Admin Panel Deiner CMS Made Simple Webseite auf Inhalte --> Fotoalbum und klicke hier auf das Icon „Kommentar bearbeiten“ unterhalb des Bildes, das Du umbenennen möchtest.

Bildern Titel und Kommentare geben im Totoalbum (online Photo Gallery) von CMS Made Simple - Jens Hauschildt

Du kannst nun im Feld „* Titel:“ einen neuen Titel, der auch angezeigt wird, so wie Kommentare, eingeben. Unterhalb des Bildes wird aber nur der erste Kommentar angezeigt. Du müsstest das Template anpassen, um alle Kommentare darzustellen. Meiner Meinung nach ist die Darstellung aller Kommentarfelder jedoch unnötig.

Die Vergabe eines sprechenden Titels empfehle ich, damit der Besucher der Seite nicht nur den Thumbnail  sieht, sondern beim Rollover mit der Maus auch schon eine Beschreibung in Form des Titels angezeigt erhält. Dies zeugt auch davon, dass Du Dir für den Besucher Deiner Webseite Arbeit gemacht hast – dies ehrt ihn.

Album Template

Für das Photo Album stehen mehrere Templates zur Verfügung. Wenn mehrere Alben auf einer Webseite existieren, kann für jedes Photo Album ein anderes Template benutzt werden. Um das entsprechende Template festzulegen, öffne Inhalte --> Fotoalbum. In der Auflistung der Alben, die Du angelegt hast, siehst Du in der Spalte „Template“ das zu jedem Fotoalbum jeweils verwendete. Um es zu ändern, klicke auf den Namen des Albums, wechsle im neuen Fenster in den Reiter „Eigenschaften“ und wähle im Auswahlmenu das Template aus, das Du zur Anzeige verwenden möchtest. Bestätige Deine Auswahl mit >>speichern<<.

Im Standard sind 4 Templates installiert. Weitere können problemlos nachinstalliert werden. Gehe hierzu in Inhalte --> Fotoalbum, wechsle in den Reiter „verfügbare Templates“ und klicke auf den Link „Template importieren“ in der Zeile, in der das Template steht, das Du installieren möchtest. Im folgenden Fenster kann der Name im Feld „*Name des neuen Templates:“ Deinem Geschmack angepasst werden, so dass DU das Template immer wieder zuordnen kannst – viele klingen einfach recht gleich oder haben keine sprechenden Namen. Bestätige nun durch Klick auf >>Absenden<<. Du kommst nun wieder auf die Seite Fotoalbum im Navigationspunkt Inhalte und erhältst die Meldung „Das Template wurde in die Datenbank importiert und kann jetzt verwendet werden.“. Das Template steht Dir nun zur Verfügung, Du hast es installiert. Die Verwendung, also Auswahl des Templates für das Photo Album geschieht nun wie oben beschrieben.

Einstellungen und Parameter

In der Standardeinstellung gelten die schönen URL`s nicht für die Photo Gallery. Sie sehen dann ungefähr so aus:

http://www.deine-domain.de/index.php?mact=Album,m5,default,1&m5albumid=1&m5returnid=49&page=49

Um schöne URL`s zu generieren, wechsle im Admin Panel auf Inhalte --> Fotoalbum und dann in den Reiter „Optionen. Deaktiviere das Kontrollkästchen „Verwenden von Inline-Links“ und klicke auf >>speichern<<. Die URL wird nun im Stil

http://www.deine-domain.de/fotoalbum/album-1/49

dargestellt. Weitere Einstellungen kannst Du durch anpassen der folgenden Parameter durchführen:

  • albums="1,3" – gibt an, welche Deiner angelegten Fotoalben angezeigt werden sollen. Den automatisch erzeugten ID findest Du in der Liste der Alben in der Spalte ID.
  • categories="1" – zeigt nur Alben an, die der Kategorie 1 zugeordnet sind. Mit Kategorien kannst Du mehrere Alben thematisch miteinander verbinden. Kategorien erzeugst Du unter Inhalte --> Fotoalbum im Reiter „Kategorien“.
  • action="recently_updated" – zeigt eine Liste der zuletzt hinzugefügten Bilder an. Tipp: Zeige auf der Startseite Deines Internet Projektes die neuesten Bilder an.
  • action="random_image" – zeigt die Bilder in zufälliger Reihenfolge an, die maximale Anzahl der angezeigten Bilder lässt sich über „number“ einstellen
  • number="3" – limitiert die Anzahl der angezeigten Bilder bei den Parametern “action=”

Die Parameter können wie üblich miteinander kombiniert werden. Um z.B. die 4 letzten hinzugefügten Bilder, die aus dem Album mit dem ID 1 stammen, anzuzeigen, füge diesen Smarty Tag in das Content Feld der Album-Seite ein:

{cms_module module="Album" albums="1" action="recently_updated" number="4"}

Für die Anzahl der Kategorien, der Fotoalben oder Bilder für die Photo Gallery sind keine grenzen gesetzt. Du kannst so viele generieren, wie Du möchtest. Auf die Bilder der online Photo Gallery kannst Du auch zugreifen, wenn Du sie im Inhalt darstellen möchtest, so dass sie nicht zweimal hochgeladen werden müssen. Und mit ein bisschen HTML Kenntnis kannst Du Dir Dein Template individuell anpassen.