Joomla! 1.5 - Perfekte PopUps

Quelle (in Englisch): www.theartofjoomla.com

Popup-Bilder sind eine beliebte Art Bilder auf einer Webseite anzeigen zu lassen. Am meisten trifft man diese Art in Bilder-Galerien; aber auch immer mehr in Artikeln und Beiträgen. Joomla! 1.5 bietet uns eine einfache Möglichkeit Popup-Bilder ohne grossen Aufwand hinzuzufügen.

Das erste was Sie dazu tun müssen ist, die folgende Code Zeile in die "index.php"-Datei Ihres Templates einzufügen. Die Code-Zeile (Modal-Modul aktivieren) sollte in den oberen Zeilen vor der DOCTYPE-Anweisung platziert werden, also vor den HTML-Code-Zeilen. Programmiertechnisch ist dies schon alles.

Nun müssen Sie nur noch den richtigen Link in Ihrem Beitrag verwenden. Zum Beispiel wie folgendes:

Nachfolgend drei Punkte die Sie hierfür beachten müssen:
- Der Link muss den Pfad zum Thumpnail beinhalten
- Die "href"-Anweisung sollte zum Original-Bild zeigen
- Fügen Sie dem Link eine "Modal" Klasse hinzu

Wie Funktioniert das ganze?

Das "Modal"-Verfahren ist eine Javascript-Routine, welche den ganzen Output einer Seite nach Links durchsucht welche die "Modal"-Class enthalten. Der Anweisung wird dann ein Anlage, in unserm Beispiel ein Bild, mittels einem Popup-Fenster zugewiesen, welche im Link referenziert wird. Die Technik nennt sich "unobtrusive javascript". Der grosse Vorteil ist die verminderte Funktion wenn Javascript nicht vorhanden ist. Damit ist gemeint, wenn Ihr Browser kein Javascript unterstützt (wie Mobile WAP Geräte zum Beispiel) haben Sie immer noch einen validen HTML-Text den man benutzen kann. Der Besucher kann das Miniatur-Bild noch immer sehen und dieses wird auch immer noch auf das Original-Bild verlinkt. Ob nun die Grösse dieses Bildes auch dem Besucher angezeigt werden kann ist ein anderes Problem, dennoch aber sieht er die Information darüber.

Kommentar schreiben