Kompatibilität:

WebSite X5 Evo und Pro

Dropbox ist einer der bekanntesten Cloud-Speicherdienste im Web. Der Dienst stellt Ihnen Web-Space zur Verfügung, den Sie nutzen können, um Dateien zu speichern und mit anderen zu teilen. Sie können zunächst ein kostenloses Konto registrieren und bei Bedarf später zu einem kostenpflichtigen Plan wechseln.


Mit dem Objekt Dropbox Gallery können Sie in Ihre Website eine Bildergalerie einbauen, bei der die anzuzeigenden Bilder direkt aus einem Dropbox-Ordner übernommen werden. Wenn Sie Dateien zu diesem Ordner hinzufügen oder daraus löschen, wird die Galerie automatisch aktualisiert und Sie müssen an der Website selbst nichts ändern. Außerdem können Sie Ihren Dropbox-Ordner freigeben, sodass auch andere Personen die Galerie aktualisieren können, ohne auf das Projekt der Website zugreifen zu müssen.



Dateien in Dropbox bereitstellen

Zuerst benötigen Sie ein Dropbox-Konto, das auch ein kostenloses sein kann. Legen Sie dort einen Ordner an und laden Sie in diesen Ordner die Bilder, die in der Galerie angezeigt werden sollen.


Gehen Sie nun wie folgt vor:  

  • Loggen Sie sich auf der Dropbox-Plattform für die Entwickler: https://www.dropbox.com/developers.
  • Sie befinden sich nun im Entwicklerbereich. Klicken Sie hier auf Create apps.
  • Folgen Sie dem geführten Verfahren: Wählen Sie Choose an API und die gewünschte Art von Zugang aus. Sie sollten bitte den Zugang auf ein einziges Verzeichnis zulassen, das Sie spezifisch für die App erstellt haben. Geben Sie jetzt einen Namen ein, z. B. MyApp und kKlicken Sie nun auf die Schaltfläche Create app. 
  • Sie haben jetzt eine eigene App erstellt und können in dieser Ansicht deren Einstellungen verwalten sowie Statistiken anzeigen. 
  • Bleiben Sie im Bereich Settings: Wie Sie sehen können, wird den Namen der App auch für das von der App verwendete Verzeichnis angewendet (App folder name). Eventuell können Sie den Namen beim Klick auf Change ändern.
  • Geben Sie ins Feld Redirect URIs den folgenden Link ein: https://webui.websitex5.com/dropbox-login/ Nachdem Sie die URL kopiert haben, klicken Sie auf die Schaltfläche Add neben dem Feld.
  • Öffnen Sie schließlich das Panel Permission und aktivieren Sie die Option files.content.read, dann klicken Sie auf Submit.
  • Jetzt können Sie zurück in den Bereich Settings gehen: Hier finden Sie den Code App Key und den Code App Secret, die Sie brauchen.


Konfiguration der Galerie in WebSite X5

Öffnen Sie jetzt WebSite X5.

  • Fügen Sie das Objekt Dropbox Gallery in eine Seite ein, markieren Sie es im Raster und klicken Sie auf  , um das Fenster mit den Einstellungen zu öffnen.
  • Kopieren Sie (STRG+C) die Codes App Key und App Secret vom Dropbox-Panel und fügen Sie sie (STRG+V) in die entsprechenden Felder in WebSite X5 ein.
  • Nach der Eingabe der Codes App Key und App Secret, eine Warnmeldung wird angezeigt, die Sie davon informiert, dass Sie einen weiteren Code brauchen: Klicken Sie auf Nach einem Refresh Token anfragen.
  • Dropbox öffnet sich in einem Browser-Fenster: Folgen Sie die Schritte, um den Refresh Token zu erhalten.
  • Kopieren Sie den Refresh Token, den Sie erhalten haben und fügen Sie ihn ins entsprechende Feld von WebSite X5 ein. Mit diesem letzten Schritt ist die Galerie mit Dropbox verbunden.
  • Geben Sie den Pfad zu dem Ordner an, in dem die Bilder in Dropbox gespeichert sind, zum Beispiel: /Bilder
  • Legen Sie die Aktualisierungsfrequenz fest, also wie oft der Ordner, aus dem die Bilder übernommen werden, auf Aktualisierungen überprüft werden soll.
  • Mit den verfügbaren grafischen Einstellungen können Sie das Aussehen und den Stil der Galerie gestalten. 


So können Sie Bilder hochladen

Nachdem Sie die App erstellt und verbunden haben, können Sie die Dateien auf Dropbox hochladen, die in der Galerie angezeigt werden sollen:

  • Gehen Sie auf der Homepage von Dropbox (Sie sollen sich bitte anmelden).
  • Im Ordner Apps finden die das Unterverzeichnis, das Sie bei der Erstellung der App eingestellt haben: In unserem Beispiel, MyApp.
  • Öffnen Sie es und erstellen Sie ein Unterverzeichnis, z. B. Bilder. Der Pfad ist also Apps/MyApp/Bilder.
  • Ziehen Sie ins Verzeichnis Bilder die gewünschten Dateien, die in der Galerie angezeigt werden müssen.


#Tipp - Wenn die Galerie nicht funktioniert, obwohl Sie allen Schritten korrekt gefolgt haben, kontaktieren Sie bitte Ihren Hosting-Anbieter, um die Schreibrechte für die Verzeichnisse zu überprüfen.


Sind Sie schon neugierig, wie die Galerie auf Ihrer Website aussieht? Installieren Sie jetzt das Objekt Dropbox Gallery


Fehlen Ihnen noch Credits für den Kauf dieses Objekts? Alle Credit-Pakete ansehen