Flickr mit Composite C1 nutzen

Nachdem wir im letzen Artikel dieEinbindung von Facebook-Alben gezeigthaben, geht es in diesem Post um dieNutzung von Flickr in Composite C1.Composite HQ hat zu diesem Zweck einPackage entwickelt, welches wir hier nutzenwerden.Wie beim Facebook-Packageauch, installieren wir vorab das Slimbox-Package, welches die automatischeGaleriedarstellung der Bilder auf unsererWebsite ermöglicht:

Anschließend installieren wir nun daseigentliche Flickr-Package‚Composite.Media.ImageGallery.Flickr‘:

Für die Nutzung von Flickr ist einsogenannter API Key notwendig, den wir imBereich Inhalt / Website-Elemente miteinem Namen hinterlegen, um ihn später imFunktionsaufruf als Parameter nutzen zukönnen:

Der API Key selbst kannunter http://www.flickr.com/services/apps/create/apply/ generiert werden.Für unsere Flickr-Galerie legen wir imBackend eine neue Seite an, auf der dieBilder später erscheinen sollen:

Nun können wir mit der Einbindung dereinzelnen Funktionen des Packagesbeginnen:

PhotostreamUm uns den sogenannten Photostream, alsodie neuesten Bilder eines Nutzersanzuzeigen, fügen wir auf der neuangelegten Seite die Funktion‘Composite.Media.Flickr.Photostream’ ein:

Als Parameter für diese Funktion übergebenwir zunächst den zuvor unter Website-Elemente definierten API Key:

Weiterhin benötigen wir die Flickr User IDals Parameter. Diese muss jedoch zuvor fürden entsprechenden Account ermitteltwerden.Ich empfehle zu diesem Zweck die Websitehttp://idgettr.com, mit deren Hilfe wir ausder Adresse unseres öffentlichenPhotostreams die User ID ermitteln können:

Anschließend übergeben wir die Flickr UserID an unsere Funktion:

Nachdem die Funktion eingefügt und dieSeite gespeichert und veröffentlicht wurde,erscheint der Photostream des Flickr-Nutzers in Form einer anklickbaren Galerieauf unserer Website:

FavoritenDie nächste Funktion ermöglicht dasAnzeigen der sogenannten Favoriten, alsoder als solche markierten Fotos eines Flickr-Users.Wir fügen dazu die Funktion‘Composite.Media.Flickr.Favorites’ aufunserer Seite ein:

Wieder übergeben wir API Key und User IDals Parameter an die Funktion, fügen dieseein und veröffentlichen die Seite erneut:

Jetzt sehen wir die Favoriten meines Flickr-Accounts auf unserer Seite – da ich bislangnoch keine angelegt hatte, habe ichbeispielhaft einige Fotos anderer User zumThema Fahrräder als Favoriten in meinemFlickr-Account markiert:

Übersicht aller AlbenBei Flickr können die Fotos in Albenorganisiert werden. Um nun alle Alben einesbestimmten Nutzer darzustellen, fügen wirdie Funktion‘Composite.Media.Flickr.PhotoSets’ aufunserer Seite ein:

Neben den obligatorischen Parametern APIKey und User ID können wir in dieserFunktion zusätzlich noch definieren, obKommentare anderer Flickr-Nutzer zu deneinzelnen Fotos dargestellt werden sollen:

Nach dem Einfügen der Funktion und demVeröffentlichen der Seite erhalten wir eineÜbersicht aller Alben des angegebenenFlickr-Nutzers:

Bilder eines einzelnen AlbumsdarstellenUm nur Bilder eines einzelnen Albumsdarzustellen, benötigen wir die Funktion‘Composite.Media.Flickr.PhotoSets.Photos’.Zusätzlich zum API Key müssen wir jetzt dieSet ID des gewünschten Albums definierenZur Ermittlung dieser ID lassen wir uns inunserem Flickr-Account das entsprechendeAlbum anzeigen und kopieren den letztenTeil der Album-URL in die Zwischenablage –dies ist die Set ID:

Nun fügen wir die Funktion ein:

Neben dem API Key fügen wir jetzt noch dieSet ID aus der Zwischenablage als Parameterein:

Als Ergebnis erhalten wir nach demEinfügen der Funktion und dem erneutenVeröffentlichen der Seite eine Galerie mitunserem gewünschten Flickr-Album:

FazitNeben Facebook ist auch Flickr eineeffektive und komfortable Möglichkeit,Bilder auf einfache Art und Weise zu hostenund auf der eigenen Website mit CompositeC1 für Galerien zu nutzen.

Flickr mit Composite C1 nutzen

by CGN Cloud Company on Aug 06, 2012

Accessibility

Categories

Upload Details

Usage Rights

2 Embeds 4

Statistics

Flickr mit Composite C1 nutzen Presentation Transcript

https://twimg0-a.akamaihd.net	3
https://si0.twimg.com	1