In meinem Artikel “Flashing Fotogalerie mit SlideShowPro” habe ich Dir das Galerie-Tool SlideShowPro vorgestellt. Heute möchte ich Dir zeigen, wie einfach es ist, mit Hilfe von Adobe Lightroom und dem SlideShowPro-Plugin Deine Fotos in eine beeindruckende Flash-Galerie zu verwandeln. Für mich stellt diese Kombination nach viel Ausprobiererei die optimale Lösung dar. Warum das so ist, wirst Du sehen, wenn Du Dir die einzelnen Schritte angesehen hast. 

Schritt 1 - Plugin installieren:
Zunächst benötigen wir das Plugin SlideShowPro for Lightroom. Dies ist zwar keine Freeware, aber bei dem Dollarkurs bringen einen die 25$ auch nicht um. Vor allem bei dem Funktionsumfang den man erhält. Für unentschlossene ist auch eine Testversion als Download erhältlich. 

Ist das Plugin heruntergeladen und im Plugin-Ordner von Lightroom installiert, kann es eigentlich auch schon losgehen mit der Galerieerstellung. Bevor wir zum 2. Schritt kommen, sollten wir überprüfen, ob die Installation geglückt ist, indem wir Lightrrom starten und die Ansicht “Web” wählen. Im Drop-Down-Feld “Galerie” sollte sich dann SlideShowPro auswählen lassen.

Schritt 2 - SlideShowPro anpassen:
Obwohl die Standardeinstellungen von SlideShowPro eigentlich auch so schon richtig gut aussehen, kann man sie nach Belieben an das Aussehen der Website anpassen.

Dazu wechselst Du zunächst in Lightroom auf den Bereich “Web” und wählst als Galerie “SlideShowPro for Lightroom” aus. Daraufhin wird Dir eine Live-Vorschau der Galerie im Arbeitsbereich von Lightroom angezeigt. Auf der rechten Seite findest Du eine lange Liste an Einstellungsmöglichkeiten, mit denen Du das Aussehen gezielt anpassen kannst. Jede Änderung, die Du dort machst, wird Dir direkt in der Vorschau angezeigt. Die Möglichkeiten reichen von Farbanpassung, über Bildgrößen für Vorschau- und Vollbildgrößen, bis hin zu Bildübergängen und Geschwindigkeiten…

Hast Du das gewünschte Aussehen der Galerie erstellt, kannst Du es als Vorlage abspeichern und musst bei einem Bildupdate nicht alle Einstellungen erneut durchführen! Du musst Dir also keine Bildgrößen mehr merken, Exporteinstellungen usw. das erledigt alles Lightroom für Dich.

Schritt 3 - Bilder auswählen
Jetzt hast Du die Qual der Wahl… welche Bilder sollen in Deiner neuen Galerie zu sehen sein? Markiere die Bilder alle in der Lightroom Vorschauleiste, indem Du sie anklickst und dabei die Steuerungstaste gedrückt hältst. Du wirst sehen, dass sich in der Galerievorschau nur noch Deine ausgewählten Bilder im Album befinden. Da die Vorschau in Lightroom voll funktionsfähig ist, kannst Du bereits jetzt Deine Galerie testen und das Album durchklicken. Hast Du alle Bilder ausgewählt, kommt auch schon der letzte Schritt.

Schritt 4 - Galerie exportieren
Um Deine Galerie auch außerhalb von Lightroom lauffähig zu bekommen, musst Du sie zunächst exportieren. Dazu klickst Du unten rechts auf die Schaltfläche “Exportieren” und es öffnet sich das Dialogfenster, um den Speicherort festzulegen. Hast Du ihn ausgewählt und mit “OK” bestätigt, wird Lightroom Deine Galerie mit allen Voreinstellungen dorthin exportieren. Der Exportstatus wird Dir oben links unter dem Lightroom-Logo angezeigt.

Ist der Export abgeschlossen, befinden sich alle benötigten Dateien in dem vorher angegebenen Ordner. Das bedeutet alle SlideShowPro-Dateien, Bilder und Vorschaubilder, die mit Photoshopalgorithmen perfekt runtergerechnet wurden und die XML-Datei zum Laden der Bilder.

Du kannst nun Deine neue Galerie online in Deinem Internetauftritt einbinden, oder aber auch als Offlinevariante auf Deinem Rechner oder einer CD-ROM benutzen. Die Möglichkeiten sind nahezu unbegrenzt.

Fazit
So, Du hast nun einen Einblick in meinen SlideShowPro “Workflow” bekommen. Ich denke einfacher und schneller kann man seine Fotos kaum in eine ansprechende Galerie verpacken. Hat man die Vorlage erstmal erstellt, können später weitere Alben innerhalb von wenigen Minuten publiziert werden. Dabei verbringt man dann allerdings die meiste Zeit mit der Bildauswahl ;-)

Was hältst Du von dieser Art der Galerieerstellung? Hast Du vielleicht noch Fragen rund um SlideShowPro? Ich bin auf Dein Feedback gespannt!

Weitersagen: Diese Icons verlinken auf Bookmark Dienste bei denen Nutzer neue Inhalte finden und mit anderen teilen können.
  • Digg
  • del.icio.us
  • StumbleUpon
  • Reddit
  • Webnews
  • MisterWong
  • Y!GG
  • TwitThis

Tags: , , ,

29 Kommentare zu “SlideShowPro - In 4 einfachen Schritten zur eigenen Flash-Foto-Galerie”

  1. Hoi Tim,

    Hast du eine Ahnung, ob es irgend eine Lösung zusammen mit Typo3 gibt?

    Gruess
    chrigel

  2. @chrigel: ja, es gibt eine TYPO3 Extension, die die Einbindung von SlideShowPro vereinfacht!

    Sie heißt: prof_slideshowpro
    Die Doku findest Du hier:
    http://typo3.org/documentation.....iew/toc/0/

    Ich bin derzeit dabei ein Tutorial dafür zu schreiben, bin aber noch nicht wirklich dazu gekommen es fertigzustellen.

    Würd mich freuen von Deinen Erfahrungen damit zu hören!
    Bis später - Tim

  3. Danke für den Tipp.
    Werde es testen

    Gruess
    chrigel

  4. Hallo,
    gibt es denn ein Tutorial?
    - Slideshow in TYPO3 ?

    grüße!

  5. Hi Basti!
    Ich bin leider bisher nicht dazu gekommen das Tutorial zu schreiben…
    Beim Extensiontest ist mir aufgefallen, dass die Doku nicht passt! Wenn ich mich recht erinnere, funktioniert es nur, wenn man in T3 auch einen Datensatz für die XML-Struktur anlegt und auf die Bilder verweist… Du findest es bei den Seiteninhalten unter “Plugin einfügen”!

    Falls Du konkrete Fragen hast, immer her damit!

  6. hallo tim-oliver, @basti, @chrigel,
    seid ihr weitergekommen? habt ihr einen tipp für mich, wo ich am besten anfange?

    was sind die schritte, um die slideshow in typo3 einzubinden?

    über eure hilfe wäre ich sehr dankbar
    margarete

  7. @margarete Yup, hab die Extension zum Laufen gebracht. Hier die Kurzform - Tutorial folgt:

    - bis einschl. Punkt 4 laut Doku installieren
    - JS für die Flashabfrage einbinden
    - Sysfolder mit den Galerien anlegen
    - Seite mit “Plugin einfügen” für Galerie
    - Seite mit “Plugin einfügen” für XML
    - param.xml im Ext.-Verzeichnis auf den korrekten Pfad anpassen!
    - slideshowpro.swf ins Webroot

    Danach sollte es laufen! Wie gesagt, Tutorial folgt… wenn Du erstmal noch Fragen hast, her damit ;-)

  8. hi tim-oliver,

    danke!

    - bis punkt 4 alles o.k.
    - js habe ich aus der von flash erzeugten html-seite vom head einfach rauskopiert und als externe js-datei im template eingebunden - o.k.?

    und natürlich habe ich fragen :) und zwar

    - “sysfolder mit galerie” anlegen:
    ich habe im sysfolder ‘nen datensatz mit “albums” erstellt.
    und im dialogfeld des albums als type “photo select” gewählt.- war das richtig, oder muss ich “path select” wählen? und wie geht’s dann weiter?

    ich habe keine vorstellung davon, wo die ganzen images der slideshow (und auch der verwendeten ordnerstruktur samt images.xml) aufgespielt werden.

    (vielleicht funzt aber auch die extension nicht richtig, weil ich nur typo3 4.0.4 verwende?)

    - seite für “plugIn” galerie und
    - seite für “plugIn” xml mit ausgangspunkt des sysfolder habe ich erstellt.
    frage: soll die slideshow.swf auf der seite mit plugIn galerie erscheinen?

    - param.xml im ext.-verzeichnis auf den korrekten pfad anpassen
    anmerkung: um das file zu editieren die “installation” aufrufen, dann
    5: All Configuration wählen und runter scrollen zu
    $TYPO3_CONF_VARS['EXT'] und [noEdit]=0 setzen
    frage: handelt es sich um folgende anweisung in param.xml?
    xmlFilePath=”index.php?type=107″
    muss ich die zahl durch die id meines sysfolders ersetzen?

    - slideshowpro.swf ins webroot
    frage: muss ich nicht in ein bestimmtes verzeichnis gehen, in dem auch alle anderen notwendigen dateien sind, also die slideshowpro.swf, die images.xml, der ordner album1 mit allen fotos im unterordner large?

    ;) viele fragen von mir - aber ich hoffe, vielleicht sind dir diese für dein tutorial von nutzen, weil ich einfach noch viel zu wenig ahnung von tyo3 und daher einen anderen blickwinkel und schlicht “anfängerprobleme” habe.

    vielen dank
    margarete

  9. Wow, da kommt man vom Bau und hat einen Kommentar bekommen, der schon fast ein kompletter Artikel für sich ist ;-)

    Zum Thema wohin mit den Bildern und woher bekommt TYPO3 die XML-Daten:
    Ich lege die Bilder in folgender Ordnerstruktur für TYPO3 an:
    fileadmin/galerie/album1
    fileadmin/galerie/album2 usw.

    Dann im Sysfolder unter “Path Select” das gewünschte Verzeichnis wählen. TYPO3 erstellt Dir daraus den Datensatz für Deine Galerie. Mit “Image Select” würdest du einzelne Bilder aus dem Fileadmin auswählen können, um sie in der Galerie anzuzeigen!

    Dadurch, dass die Seite mit Plugin XML auf den Sysfolder verweist, baut Dir TYPO3 auch direkt die XML-Struktur auf (ruf mal die Vorschau der XML-Seite auf). Den xmlFilePath setzt Du in der param.xml entweder auf die ID Deiner Seite mit dem XML-Plugin, oder im Falle von simulateStatic kannst Du auch den Alias angeben…

    Damit bei mir SlideShowPro überhaupt angezeigt wird, muss ich die SWF direkt ins Webroot legen, also gleiche Ebene wie die index.php von TYPO3! Sonst haut es nich hin…

    Ich hoffe, das hilft Dir erstmal weiter! Den Rest packe ich ins Tutorial… noch Fragen? Her damit! ;-)

  10. Das Tutorial zur TYPO3 Extension prof_slideshowpro gibts ab jetzt hier:
    http://www.punsk.de/forografie.....fur-typo3/

  11. hallo tim-oliver,

    vielen dank für deine antwort. jetzt verstehe ich die zusammenhänge :)

    ich habe die extension auf typo 4.0.4 installiert (mit php 5.2.6) und leider fehlt mir, wenn ich im
    sys-ordner “path select” wähle, das formularfeld zur eingabe des pfades.

    welche version von typo3 verwendest du?

    ciao
    margarete

  12. Ich habe gerade Version 4.2.1 im Einsatz. Aber wie Hendrik im Kommentar zum Tutorial schon erwähnt, sollte ich aus Sicherheitsgründen demnächst mal ein Update durchführen…

    Bei 4.0.4 solltest Du das auch tun ;-)

  13. Hey, na da werde ich doch gleich mal einen neuen Beitrag in meinem Blog schrieben!

    Sehr gut, konnte aber leider das ganze noch nicht testen!

    grüße, basti

  14. [...] und vielen Nachfragen an Tim hat er es endlich geschafft ein Tutorial für die TYPO3 Extension (prof_slideshowpro) fertigzustellen. viel Spass beim einbinden und testen! Link: [...]

  15. Ich wäre mit slideshowpro echt glücklich, würde ich

    a) die Möglichkeit, die fertig exportierten Albums in eine HTML-Seite einzubinden (und zwar ohne das swf-File verändern zu müssen), begreifen.

    b) eine Beschreibung der verschiedenen Parameter in einer Liste (schön wäre deutsch, aber man ist ja bescheiden ;)) finden können. Einige Parameter klingen so ähnlich, dass ich nicht erkennen kann, wo die Unterschiede liegen. Und Try & Error mag zwar lustig sein, hält mich aber jetzt ohnehin schon tagelang auf.

    Hast du eventuell Antworten bzw. Links für mich? Über Onkel Google war ich nicht sehr erfolgreich. :-/

    lG Ernst

  16. Was man nicht im Hirn hat, muss man später posten:

    Ich habe auf deiner Seite und auf einer weiteren gesehen, dass es möglich zu sein scheint, auch ein “Galerie-Deckblatt” mit Links zu den verschiedenen Alben zu erstellen.

    Ich habe bislang leider nicht wirklich herausgefunden, wie das funktioniert, da die Begriffe “album” und “galery” in den amerikanischen Texten doch freizuügigst vermischt erscheinen.

    Hast du einen diesbezüglichen Tipp für mich?

    lG Ernst

  17. @Ernst:
    zur Einbindung der SWF solltest Du in der Standardkonf sicherstellen, dass Du die slideshowpro.swf, param.xml und images.xml im gleichen Verzeichnis hast. Dann würde ich Dir zu Einbindung swfObject empfehlen! Da hast Du gleich noch eine schicke Flashabfrage dabei:
    Doku (sogar DE):
    http://blog.powerflasher.de/swfobject2/

    Wenn ich Deinen Punkt “b” so lese, benutzt Du die Flashversion, richtig? Bei mir war damals ein PDF mit dabei, in dem glaube ich alle Einstellungen erklärt sind. Als Alternative kann ich dir SSP für Lightroom empfehlen (siehe oben)! Mit der Preview lassen sich die Einstellungen bequem testen.

    Ich gehe mal davon aus, dass Du ein Galerie Thumbnail meinst… Um das zu benutzen, musst Du zunächst in Deiner param.xml folgende Stelle suchen “galleryAppearance=”. Aus diesem Eintrag solltest Du folgendes machen: galleryAppearance=”Open at Startup”. Dann wird in Deiner images.xml für jedes Album ein Vorschaubild gesetzt. In “

    Viel Erfolg
    Tim

  18. > zur Einbindung der SWF solltest Du in der Standardkonf sicherstellen, dass Du die slideshowpro.swf, param.xml und images.xml im gleichen Verzeichnis hast.

    Derzeit mal “Bahnhof”, “spanisches Dorf” etc. Die angeführten Dateien sind derzeit in einem Verzeichnis, dem in dem das Album abgelegt ist. Aber ich werde mal versuchen, mehr darüber zu erfahren.

    > Wenn ich Deinen Punkt “b” so lese, benutzt Du die Flashversion, richtig?

    Nein, nicht richtig. Ich teste derzeit das PlugIn für Lightroom, werde ich nach bisherigen Tests ziemlich sicher auch kaufen. Muss nur noch ein paar Kleinigkeiten (z.B. die Einbindung in ein stinknormales HTML-File wie auch die Bedienung der Galerie-Übersicht - wie füge ich weitere Alebn hinzu etc.) klären.

    Die Einbindung, wie du sie oben beschrieben hast, überfordert mich momentan noch ein bisserl, ich werde aber, sobald möglich, die von dir verlinkte Doku durchackern. Hoffentlich verstehe ich dann wenigstens das Wichtigste.

    Danke einstweilen für die schnelle Antwort!
    lG Ernst

  19. Hm… weißt Du überhaupt wie SSP arbeitet? Schonmal in irgendeine Doku dazu geschaut? Wie siehts mit HTML, JS und Flashgrundlagen aus?
    Ohne diese wirds schwierig einfach mal schnell eine Galerie einzubinden…
    Wenn Du Lightroom benutzt und Dir T&E zu lange dauert weiß ich auch nich weiter… komfortabler geht’s doch schon nich mehr.

    Die Galerieansicht steuerst Du in Lightroom über den Punkt “Gallery” -> “Appearance” -> “Open at Startup”.

    Um weitere Galerien einzubinden, musst Du in Lightroom eine weitere Galerie exportieren. Dabei wird eine neue images.xml erzeugt. Aus der Datei kopierst Du alles von “<album” bis “</album>” in Deine bestehende images.xml. Dann die xml Datei + die neuen Bildverzeichnisse auf den Server. Fertig ist die neue Galerie!

    Viel Erfolg
    Tim

  20. > Hm… weißt Du überhaupt wie SSP arbeitet?

    Schon, langsam fresse ich mich durch die Parameter. Um allerdings einen bestimmten zu finden, finde ich die Parameterwurst a) ein wenig lang und b) ein wenig unübersichtlich wegen vieler ähnlicher Parameter.

    > komfortabler geht’s doch schon nich mehr.

    Kann ich daher nicht ganz nachvollziehen. Wo immer ich bislang zu arbeiten begann (z.B. neue Datenbanksprachen), gab es eine übersichtliche (und gut sortierte) Tabelle mit Command & Functions und der zugehörigen Syntx bzw. Parameter samt Wirkungsweise. Das fehlt mir bei SSP - aber vielleicht fehlt das nur bei der Testversion, werde ich in Kürze sehen. Und leider ist auch die Onlinehilfe nicht ganz so, dass ich finde, was ich suche. Du magst mich jetzt für beschränkt halten, das halte ich aus. ;)

    > Wie siehts mit HTML, JS und Flashgrundlagen aus?

    HTML ganz brauchbar, JS nur mehr notgedrungen ein wenig, Flash so gut wie nicht.

    > Die Galerieansicht steuerst Du in Lightroom über den Punkt “Gallery” -> “Appearance” -> “Open at Startup”.

    Soweit war ich schon (kurz nach meinem ersten Posting).

    > Um weitere Galerien einzubinden, …

    Danke, das hilft mir weiter. Danke für deine Geduld!

    lG Ernst

  21. Ich hab mal im SSP Wiki nachgesehen. Da werden die einzelnen Parameter mit Screenshots dargestellt.
    Guckst Du im User Guide unter Appearance:
    http://wiki.slideshowpro.net/SSPlr/UG-UserGuide

    Wenn Du auf einen Parameter nicht über Lightroom zugreifen kannst, kannst Du den Wert auch direkt in Deiner param.xml setzen…

    Viel Erfolg
    Tim

  22. Lieber Tim,

    ich danke dir für deine Geduld. Mittlerweile bin ich schon auf dem richtigen Weg und habe auch schon die Parameter-Erläuterungen gefunden. Ich hoffe, ich habe dich nicht allzusehr mit meinen Fragen genervt.

    Danke nochmals!
    Ernst

  23. Das klingt doch super! Also ist die Galerie schon fast online?
    Wenn Du irgendwo nicht weiterkommst, einfach fragen! Dann bring ich dich auf den richtigen Weg zurück ;-)

  24. Posting wieder möglich?

  25. Ha, da ist doch mein Posting völlig verschwunden! Zumindest war es einige Tage nicht möglich, einen Kommentar zu unserer Unterhaltung hinzuzufügen.

    Also nochmals in Kurzfassung:

    Ich habe leider noch erhebliche Probleme bei der Einbindung einer Galerie in ein HTML (mit Menüs zurück zu den div. Seiten der HP). Ich stehe immer (noch) bei der Fehlermeldung, dass Flash-PlugIn vorhanden und Javascript eingeschaltet sein müssen. Was sie sind, auf beiden Browsern (IE8 und Firefox 3.6). Kein Hinweis, wann und wo das Script hängt…

    Der Codeteil, den ich nach Vorgaben der SSP Hilfe “zusammengebastelt” habe, im nächsten Posting…

  26. Code kann hier nicht gepostet werden - aha! Die Codeschnipsel sind daher per Mail an dich gegangen.

    Die Pfade sollten stimmen (xmal durchgesehen, aber vielleicht fehlt in der Anleitung irgendein Schnipsel). Die Umbenennung der Album-Namen wurde in der images.xml berücksichtig.

    Any ideas?

    lG Ernst

  27. Hm, Postings gingen nich?! Dein Post wurde als Spam eingestuft… wohl wegen dem Code…
    Kannst Du mir Deine Verzeichnisstruktur mit den entsprechenden Dateien mal als Zip mailen?

  28. Hallo

    habe mit slide show pro für lightroomm die Schwierigkeit mehrere gallerien einzubinden…kann ich da bitte Hilfe haben, versteh nicht so viel von Html

    Danke und lg

  29. Hallo Emil,

    soweit ich weiß, musst Du jede Galerie einzeln mit Lightroom exportieren und sie dann von Hand in der images.xaml zusammenkopieren.

Schreibe ein Kommentar