Typo3: Bestimmte Seiten immer in Fancybox/Lightbox öffnen

Gelegentlich macht es Sinn, das manche Seiten einer Typo3-basierten Webpräsenz ausschließlich in einer Fancybox bzw. Lightbox geöffnet werden. Dies ist grundsätzlich ohne großen Aufwand möglich.

Durch diese Vorgehensweise können zum Beispiel auch Bilder eines Text-Mit-Bild Elements auf Seiten verlinken, die in einer Lightbox geöffnet werden. Dies ist beispielsweise beim Verlinken von Videos (die in der Lightbox geöffnet werden) mittels eines Teaser-Thumbnails sinnvoll.

1. Fancybox installieren

Zuerst müssen jQuery und Fancybox im Typo3-System bereit stehen (wird in dieser Kurzanleitung nicht erklärt). Die Installationsanleitung ergibt sich aus der Fancybox-Seite: Es müssen lediglich die entsprechenden Dateien im Head der Seite eingebunden werden.

2. Konfiguration der Fancybox

In einem zweiten Schritt muss die Fancybox so konfiguriert werden, dass Seiten mit dem Target "fancybox" nicht in einem neuen Fenster sondern als Fancybox/Iframe geöffnet werden. Dies geschieht, in dem man in der Konfigurations-JavaScript-Datei der Fancybox an geeigneter Stelle folgendes ergänzt:

$("a[target=fancybox]").fancybox({
  "type" : "iframe",  
  "width" : 820,  
  "height" : 620 
});

Die Angaben zu width und height können natürlich je nach Bedarf angepasst werden.

3. Target der Zielseiten definieren

Abschließend muss lediglich auf der Zielseite (die sich in der Fancybox öffnen soll) in den Seiteneigenschaften als Link-Ziel (Target-Attribut) "fancybox" hinterlegt werden. Anschließend öffnen sich alle Links zu dieser entsprechenden Seite (falls auf der verlinkenden Seite die Fancybox in der oben beschriebenen Konfiguration äuft) in einer Fancybox.