Bei Bildern in Inhaltselementen bietet TYPO3 die „Klick-Vergrößerung“ an. Das bedeutet, dass nach einem Klick auf ein Thumbnail eine größere Variante des Bilder in einem PopUp-Fenster angezeigt wird.
Jetzt ist dieser Effekt nicht besonders schön und auch überhaupt nicht anpassbar. Als Alternative bietet sich ein Lightbox-Effekt an. Für TYPO3 werden dafür einige Extensions angeboten. Im folgenden Video möchte ich euch die „PerfectLightbox“ vorstellen.
Viel Spaß!


[youtube]https://www.youtube.com/watch?v=paRcUmz57-o[/youtube]
Alle TYPO3-Tutorials kostenlos downloaden

Dieser Beitrag hat 28 Kommentare

  1. Hanz Maaz

    Wenn ich die „Sitemap“ im Tutorial nutze, muss ich „Perfekt-Lightbox“
    deinstallieren, weil sonst Perfekt-Lightbox aus einem mir nicht bekannten Grund versucht,
    die „Sitemap“ zu laden. Schwarzer Schirm mit eingefrorenem Ladeversuch.
    Bin alle möglich Einstellungen im Konstanteneditor durchgegangen,
    oder auch versucht „perfektlightbox“ nicht als Standard, sondern nur für spezielle Seiten
    zu verwenden – ohne Erfolg. Entweder „Sitemap“ oder „Perfekt-Lightbox“ – Schade!

  2. Hanz Maaz

    Danke für den Tipp. Habe Shadowbox installiert und funktioniert einwandfrei, und auch die Sitemap wird korrekt angezeigt.

  3. Hendrik

    PerfectLightbox läuft Super, aber wie kann ich evtl. kleine Vorschaubilder aber größere „Klick-Vergrößern“ Bilder einbinden. Ich kann mit typo3 4.4.2 große Vorschaubilder zb. 600px Breit auf 200px Bildmaße
    Breite (Pixel): nicht verkleinern es wird dann nur ein leerer Rahmen angezeigt. Bild-Links
    Verweis: andere url geht das Bild nur normal ohne Effekt auf

    1. Wolfgang Wagner

      Hä? Ich kapier jetzt gerade nicht, was genau du meinst 8-o

  4. Hendrik

    Hi – wenn ich ein Vorschaubild auf der typo3 Seite habe z.B. mit 200 x 100 wird es nicht größer. Das Bild soll aber durch die perfectlightbox z.B. 600 x 500px werden. kann man evtl. ein größeres zweites Bild einbinden wegen der besseren Qualität oder wie geht es größer. Im Typo3 Bild Modul–Page geht ein Bild wenn es original 400px hat nicht in den Bildmaßen auf 200px einzustellen – da kommt bei mir nur ein leerer Rahmen ohne Bild. Danke noch einmal für die gute Video Anleitung habe Stundenlang ohne Erfolg experimentiert es wie immer lag es nur an den entscheidenden kleinen Wert

    1. Wolfgang Wagner

      Normalerweise geht man so vor:
      1. großes Bild hochladen, z.B. 1024x768px
      2. Inhaltselement anlegen, Bild über den Reiter „Medien“ einbinden, Breite oder Höhe angeben, z.B. 200, das Häkchen bei „Klick-Vergrößern“ setzen
      Du darfst in dem Feld für Breite und Höhe aber keine Einheit angeben, also nicht 200px, sondern nur 200
      Und so geht das bei dir nicht?

  5. Theresa

    Vielen Dank für das Video.
    Leider klappt es bei mir mit der Perfectlightbox nicht so wie es sein soll. Die Bilder öffnen sich, aber ohne den transparenten Hintergrund auf einer komplett weissen Fläche ohne dass die ursprüngliche Seite zu sehen ist. Schade…. Weiss vllt. einer, woran das liegt?
    Vielen Dank

    1. Wolfgang Wagner

      Vielleicht ein Javascript-Konflikt mit einer anderen Extension?
      Oder etwas im Konstanten-Editor falsch eingestellt?
      Hast du einen Link, wo man sich das ganze mal anschauen kann?

      1. Theresa

        Die Seite kann man sich unter http://pfadfinderkr.theresa-gorgs.de/index.php?id=23
        ansehen. Ich habe auf der Startseite bereits eine JavaFunktion (siehe Sprüche), kann jedoch nicht erkennen, ob dort ein Konflikt besteht. Es sind meines Wissens keine weiteren Extensions mit Java-Funktionen vorhanden. Der Konstanten-Editor ist wie im Film eingestellt.
        Grüße aus Krefeld
        Theresa

        1. Wolfgang Wagner

          Im Quellcode deiner Seite sehe ich, dass das Javascript der Lightbox überhaupt nicht eingebunden wird.
          Hast du das statische Template von PerfectLightbox in dein Root-Template eingefügt? (-> Vollständigen Datensatz bearbeiten)

          1. Theresa

            hmmm, ich arbeite mit Typo3 4.4.4
            es existiert bei mir kein Root – Symbol (Weltkugel)
            Ich habe die Perfectlightbox in einen Sys-Ordner gepackt und dort das Template zzgl. die Perfectlightbox eingefügt und dafür das Häkchen bei Root gesetzt. Dann habe ich für die Seite, in welcher die Diashow erscheinen soll das Template der Lightbox unter „include Template“ eingebunden. – Leider tut sich dann nix.
            Wenn ich nun extra die Perfectlightbox über „Include static (from extensions):“ einbinde und alle Einstellungen noch mal vornehme, dann tut sich auch nix.
            Kann man das javascript irgendwie anders einbinden? Ich habe in den Constanten Editor ein Script aus der Typo3 Repository eingebunden, dass bei Nutzern, welche Probleme bei komprimierten Scripten haben, helfen soll. Leider hilft mir das alles bei diesem Problem nicht weiter….
            Ich möchte unbedingt eine Lightbox haben, darum gebe ich zur Zeit nicht auf und bin für jeden Tipp dankbar.
            Vielen Dank

  6. Hendrik

    Habe es wieder eingebunden – diese Meldung kommt aber nur beim IE.
    Details zum Fehler auf der Webseite
    Benutzer-Agent: Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.0; WOW64; Trident/4.0; SLCC1; .NET CLR 2.0.50727; Media Center PC 5.0; .NET CLR 3.0.30729; InfoPath.2; .NET CLR 3.5.30729; .NET4.0C)
    Zeitstempel: Tue, 28 Dec 2010 14:37:15 UTC
    Meldung: Das Objekt unterstützt diese Eigenschaft oder Methode nicht.
    Zeile: 1
    Zeichen: 1648
    Code: 0
    URI: http://www.familienpartei-jena.de/typo3conf/ext/perfectlightbox/res/js/lightbox.2.0.4.yui.js

  7. Micha

    Hallo,
    ich habe dasselbe Problem wie Theresa.
    Ich kann die Bildgröße im Backend nicht über witdh unf hight einstellen. passiert gar nichts. das bild wird in der vorschau und mit lightbox in der originalgröße angezeigt.
    Ein Idee,das Problem zu beheben?
    Grüße
    Micha

  8. Wolfgang Wagner

    Und wenn ihr mal eine andere Lightbox ausprobiert? Noch ein Tipp: ihr könnt für solche Probleme auch das Forum nutzen, da ist die Wahrscheinlichkeit größer, dass ein user eine Lösung kennt.

  9. Hanz Maaz

    HI Wolfgang,
    ich will mit der PmkShadowbox ein Vorschaubild durch „Klick-vergrößern“ auf ein mp4-Video verlinken. Geht auch, aber leider nicht in der Größe des Videos (428x240px). Die „Shadowbox“ ist zu klein und das sieht nicht gut aus. Wie kann ich das Vorschaufenster an die Videogröße anpassen? Hast Du vielleicht eine Idee?
    LG Hanz

    1. Wolfgang Wagner

      Sorry, keine Ahnung, da müsste ich auch die Doku durchlesen. Oder probier mal die rzcolorbox, mit der müsste das theoretisch auch gehen.

      1. Hanz Maaz

        Danke für die schnelle Antwort – LG Hanz

  10. Maike Keune

    Super Tutorial, das hat mir grad den Tag gerettet =)

  11. max

    hab jetzt schon diverses probiert, ist es nicht möglich eine html die im fileadmin liegt in der lightbox zu öffnen? jmd. eine idee?

      1. max

        danke für den tipps, werds mal mit der probieren.

      2. max

        funktioniert wunderbar, besten dank für den guten tipp!

  12. Klaus Börschinger

    Hi,
    jetzt hätte ich auch mal ne Frage zu einem ganz komischen Problem. Perfect Lightbox habe ich unter Typo3 6 installiert. Bei der Anzeige von einzelnen Bildern funktionierts. Aber sobald ich mehere Bilder über einen Datensatz einfüge, wird im Quelltext vor dem Bilderlink der HTML-Code rel=“lightbox… nicht eingebunden. Damit funktioniert dann auch das Lightbox nicht, logischerweise. Bei einzelnen Bilder funktionierts.
    Vielleicht kann mir jemand zur Lösung verhelfen?

    1. Julian Stock

      So funktioniert PerfectLightbox auch mit Typo3 6.0 und mehreren Bildern:
      Zeile 59 bzw. 84 in Datei „typo3conf/ext/perfectlightbox/class.tx_perfectlightbox.php“:
      Aus
      if ($this->cObj->data['image_link']!='') {
      wird
      if (trim($this->cObj->data['image_link'])!='') {

      1. hastacaramba

        Vielen Dank für diesen Hinweis!

  13. anjat

    Danke für den Tipp, ich war wirklich kurz vorm Verzweifeln!

Kommentare sind geschlossen.