"Bild Popup" Fenster verändern

Bei Contentelementen mit Bildern gibt es die Möglichkeit, bei einem Klick auf das Bild entweder zu einer Ziel-URL zu verzweigen oder aber das Bild vergrössert in einem separaten Popup-Fenster anzuzeigen (dazu muss Javascript eingeschaltet sein). Das neue Browserfenster ist an die Bildgrösse angepasst, das Bild ist dabei von einem schwarzen Rahmen umgeben. Die Rahmenbreite links und oben hängen vom verwendeten Browser ab, die Breite rechts und unten ist durch Standardwerte definiert. Mit wenigen Zeilen Typoscript können Farbe und Breite des Rahmens sowie weitere Parameter angepasst werden. Im Objectbrowser finden sich die Standardwerte im Pfad tt_content.image.20.1.imageLinkWrap

Die Hintergrundfarbe (und damit auch die des Rahmens um das Bild) kann individuell mit dem Bodytag des Popup-Fensters festgelegt werden. Mit den Einstellungen für topmargin, leftmargin, bottommargin und rightmargin legt man die Rahmenbreite links und oben fest. Die Browser unterscheiden sich nämlich in ihren Defaultwerten für die Margins. Setzt man alle Werte auf 0, so ist der schwarze Rahmen um das Bild nicht sichtbar:

tt_content.image.20.1.imageLinkWrap {
bodyTag = <body style="margin:0; background: #ccc;">
}

Wenn man dem Bild eine Angabe der Quelle oder des Copyrights hinzufügen möchte, kann dies zum Beispiel in einem Textbereich unterhalb der Abbildung erfolgen. Dazu wird das Fenster mit dem Parameter JSwindow.expand um ein paar Pixel nach unten erweitert:

tt_content.image.20.1.imageLinkWrap.JSwindow.expand = 0,20

Ein Text unter dem Bild lässt sich über den wrap-Parameter einfügen, dieser schliesst das img-Tag im Fenster ein. Im folgenden Beispiel wird unter dem Bild eine Tabellenzeile mit rechtsbündiger Ausrichtung platziert, die den Text www.jweiland.net enthält:

tt_content.image.20.1.imageLinkWrap {
bodyTag = <body style="margin:0; background: #ccc;">
width = 960m
title = Image from jweiland.net
JSwindow.expand = 0,20
wrap = <A href="javascript:close();"> | </a><br /><table align="right"><tr><td><font face="verdana,arial,helvetica,sans-serif" size="2" color="#666666">www.jweiland.net</font></td></tr></table>
}

Die maximale Grösse für Bilder im Popupfenster ist auf 800 x 600 Pixel eingestellt. Diesen Wert kann man durch Angabe von width und/oder height verändern, ein 'm' hinter der Grössenangabe sorgt dafür, dass das Seitenverhältnis beibehalten wird:

tt_content.image.20.1.imageLinkWrap.width = 960m

Wer mag, kann auch den Inhalt der Titelzeile im neuen Fenster ändern:

tt_content.image.20.1.imageLinkWrap.title = Bild im Popup-Fenster
Aktualisiert: 29.06.2016