Skip to main content

Joomla Bildergalerie aus Google Fotos und Google Plus Beiträgen mit Ozio Gallery

Bilder folgen in Kürze!

Für einen Webdesign Kunden aus Neustadt i. H. habe ich ein Fotoalbum mit seinen eigenen Google Fotos in seine Homepage eingebunden. Die Homepage des Webdesign Kunden aus dem Bereich Gartenbau ist mit dem Content-Management-System Joomla 3.x erstellt und die Bilder aus dem Google Fotos Album sollen ohne weitere Anpassungs-Arbeiten (im Bildbearbeitungsprogramm oder in Joomla) automatisch auf der Joomla Website dargestellt werden. Der Kunde möchte also die Bilder nicht extra bearbeiten und dann umständlich hochladen.

Diese Aufgabe lässt sich wunderbar mit der Joomla 3.x Erweiterung Ozio Gallery realisieren. Bilder aus Google Plus und Google Fotos (und auch aus anderen Quellen wie Flicker und sogar Youtube-Videos) können mit Ozio Gallery in Beiträgen und Modulen ausgegeben werden. Dabei wird automatisch die Dateigröße der Bilder so verkleinert, dass die Ladezeiten der Bildergalerie gering bleibt und die Bildgröße für den jeweiligen Monitor optimiert ist. Die Anordnung der Bilder geschieht responsive, passt sich also dem Monitor an und sieht auf allen Ausgabegeräten (PC, Tablet, Handy/Smartphone) gleich schick aus.

Die Ozio Gallery Installation besteht aus der Komponente und einem Plugin. So kann ein Album sowohl als eigene Contentseite über einen Menüpunkt ausgegeben werden als auch in beliebigem Content (Beitrag oder Modul) über das Plugin.

Bei der folgenden Anleitung zeige ich nur die Einbindung von Bildern aus Google Fotos und gehe davon aus, dass Ozio Gallery bereits installiert ist und ein Google-Account mit Google Fotos vorhanden ist.

Um nun eine Google Bildergalerie in Joomla 3.4 zu erstellen benötigt man:

  • eine Joomla Website mit installierter Ozio Gallery Erweiterung
  • einen Google Fotos Account

Und so gehts: Bildergalerie erstellen

1. Album in Google Fotos einrichten

  • Zuerst meldet man sich in seinem Google-Konto an und wechselt dann zu Google Fotos und dort dann in den Bereich Fotos.
  • Wenn die Fotos für das gewünschte Album noch nicht hochgeladen sind, so können diese jetzt in Google Fotos hochgeladen werden:
    • Dazu auf die kleine schwarze Wolke klicken und die Fotos auf dem lokalen PC auswählen und hochladen.
  • Um ein neues Album zu erstellen gibt es zwei Möglichkeiten:
    • Bilder auswählen und mit diesen ein neues Album erstellen
      Im Bereich Fotos kann man ein Bild markieren, indem man mit der Maus über die linke obere Ecke des Bildes fährt und den dann erscheinenden Kreis/Haken klickt. So kann man beliebig viele Bilder markieren, um dann für alle eine gemeinsame Aktion zu wählen. Oben rechts wählt man nun das mittlere Symbol, also das Plus-Zeichen, wählt dort Album aus und schließlich „Neues Album“. Nun wird ein neues Album erstellt, dem man noch einen eigenen Namen geben kann. Nun erscheint das neue Album im Bereich Alben in Google Fotos.
    • erst das Album erstellen, dann Fotos zuweisen
      Im Bereich Alben oben rechts neben dem Suchen-Feld auf das Plus-Zeichen klicken, Album auswählen (nicht geteiltes Album!), Fotos wie oben beschrieben markieren und dann Fertig (oben rechts) klicken.

2. Ozio Gallery einrichten

Ruft man die Komponente selbst über das Menü im Joomla-Backend auf (Komponenten -> Ozio Gallery), so erhält man nur Informationstexte zu Ozio Gallery. Auch über den Button „Optionen“ oben rechts findet man ausser zu Berechtigungen keine weiteren Einstellungsmöglichkeiten. Alle Einstellungen werden im Menüpunkt vorgenommen.

Ozio Gallery als Menüpunkt

Um ein Google Fotos Album zu verknüpfen legt man zuerst einen neuen Menüpunkt an und wählt als Menüeintragstyp die Ozio Gallery. Hier hat man dann verschiedene Galerie Oberflächen zur Auswahl:

  • Skin Nano: zeigt Fotos von Google Plus, Google Fotos oder Flicker
  • Skin Video/photo light Gallery: zeigt Videos von Youtube oder Fotos von Google Plus
  • Skin jGallery: zeigt Fotos von Google Plus
  • Albenliste: Zeigt alle freigegebenen und aktiven Alben von Google Plus oder Google Fotos
  • Karte der Bilder: zeigt die Karte von Google Maps mit den Orten der Album-Bilder entsprechend der gespeicherten Geo-Location.
  • Skin Fuerte: zeigt Fotos von Google Plus oder Google Fotos

Ich verwende vorerst die Auswahl Skin Nano und wechsel dann zur Registerkarte Optionen.

  • Unter Storage type wähle ich Google Photo/Google+
  • Unter User ID muss die User Id vom Google-Konto angegeben werden.

    Wenn man diese nicht weiß, so kann man sie folgendermaßen ermitteln und eintippen:

    • Google Plus im Browser aufrufen (https://plus.google.com) und in das eigene Konto anmelden
    • Das eigene Profil aufrufen
    • User-ID aus Adresszeile des Browsers ablesen (siehe rote Markierung im Bild).

    Oder wenn man bereits in sein Google-Konto angemeldet ist kann Ozio Gallery die ID auch eigenständig ermitteln:

    • Dazu die voreingestellte ID (diese ist direkt von Ozio und kann zum Testen verwendet werden) aus dem Eingabefeld löschen und den Button rechts daneben klicken.
    • Jetzt öffnet sich ein Popup, in dem man sein Google-Konto auswählen kann (besitzt man mehrere, so werden alle angezeigt).
    • Nach einem Klick auf das gewünschte Konto wird die Google User ID automatisch in das entsprechende Eingabefeld im Joomla Backend eingetragen.
      Achtung: Sollte das nicht funktionieren, dann einfach den Browser wechseln. Bei mir klappte dies nicht mit Firefox, wohl aber mit Google Chrome!
  • Unter Album List muss nun das gewünschte Fotoalbum aus dem Google Fotos Account ausgewählt werden:

    Klickt man in das Eingabefeld, so öffnet sich die Liste der Alben, die unter der oben eingegebenen User-ID gespeichert und freigegeben sind. Hat man ein neues Album erstellt und dieses wird nicht angezeigt, so geht man folgendermaßen vor:

    • Den Button rechts neben dem Eingabefeld (Zahnradsymbol) drücken und es erscheint ein Popup-Fenster, in dem man sein sein Google-Konto auswählen kann (besitzt man mehrere, so werden alle angezeigt).
    • Nach einem Klick auf das gewünschte Konto öffnet sich ein weiteres Fenster, in dem alle gespeicherten Google Alben gelistet sind.
      Achtung: Sollte das nicht funktionieren, dann einfach den Browser wechseln. Bei mir klappte dies nicht mit Firefox, wohl aber mit Google Chrome!
    • In dieser Liste das neue Album auswählen und „Make Public“ klicken, anschließend OK klicken. Jetzt erscheint das neue Album in der Album List und kann ausgewählt werden.
  • Wird nun der neue Menüeintrag über das Frontend aufgerufen, so sollte das Album als Fotogalerie dargestellt werden. Hat man einmal etwas im Google Album geändert, z. B. weitere Fotos hinzu gefügt, so dauert es ein wenig, bis die Änderungen auch bei der Ozio Gallery in Joomla ankommen. Also einfach ein bisschen warten.

Ozio Gallery im Modul oder Beitrag

Möchte man eine Foto-Galerie nicht als Menüpunkt, sondern innerhalb eines Modules oder Beitrages anzeigen, so verwendet man dazu das Ozio Plugin. Dieses ist nach der Installation automatisch aktiviert und kann direkt verwendet werden.

An der betreffenden Stelle im Modul Eigene Inhalte (oder im Beitrag) muss die Referenz zur Ozio Gallery folgendermaßen angegeben werden:

{oziogallery 122}

 

Um diesen Code zu erzeugen stellt der Hersteller einen eigenen Button im Content-Editor zur Verfügung, der direkt nach der Installation von Ozio Gallery automatisch unterhalb des Editor-Fensters erscheint. Klickt man auf diesen, so erscheint ein Popup-Fenster, in dem man die gewünschte Galerie aus allen mit Ozio verknüpften Galerien auswählen kann. Nach dem Klick erscheint der benötigte Code direkt an der Stelle, an der der Cursor steht.

Jetzt muss noch in den Moduloptionen die folgende Einstellung gewählt werden:

Inhalte vorbereiten: Ja

 

Es gibt noch eine Vielzahl von Einstellungsmöglichkeiten innerhalb eines Ozio-Menüpunktes und die Komponente bietet noch einige interessante Möglichkeiten, die hier wegen des Umfanges nicht detailliert beschrieben werden. Bei starker Nachfrage und genügend Kapazitäten schreibe ich aber gerne eine Fortsetzung der Anleitung.

 

Weitere Möglichkeiten der Ozio Gallery

  • Anzeige von Google Maps Karten entsprechend der Geo-Location von Fotos
  • Anzeige von geschachtelten Alben
  • Anzeige von Albumtitel und Bildbeschreibung
  • Anzeige von zusätzlichen Bildinformationen
  • Verschiedene Arten der Galerie-Darstellung

 

Links

Ozio Gallery Download bei Joomla Extensions
http://extensions.joomla.org/extensions/extension/photos-a-images/galleries/ozio-gallery

Ozio Gallery Homepage (nur englisch verfügbar)
http://www.opensourcesolutions.es/en/ext/ozio-gallery.html

Ozio Gallery Demo
http://www.opensourcesolutions.es/en/ext/ozio-gallery/demo.html

Google Fotos
https://photos.google.com/