Joomla! Programmierung/Programmierung/Templates/Overrides

Vorwort

Der vorliegende Text ist eine Interpretation, in erster Linie aber eine Übersetzung des Tutorials von Andrew Eddie: „Understanding Output Overrides in Joomla! 1.5“. Den original Text finden Sie unter der Adresse: http://docs.joomla.org/Understanding_Output_Overrides

Einleitung

Als Webdesigner werden Sie bei Ihrer täglichen Arbeit mit verschiedenen, zum Teil gegensätzlichen Anforderungen konfrontiert. Diese reichen von gesetzlichen Vorgaben, Barrierefreiheit und Usability bis hin zu persönlichen Vorlieben. Entgegen dem Versuch Ihnen diese Freiheiten bei der Gestaltung der Ansichten Ihrer Webseite über möglichst viele Schalter zu gewährleisten und dadurch Gefahr zu laufen diese zu überladen, oder dem Kompromiss eines nur bedingt zufriedenstellenden Mittelwegs, gibt Joomla! Ihnen die volle Kontrolle über die Gestaltung der Ausgaben.

Joomla! wurde bislang vorgeworfen teils altertümliche Ziele bei der Einhaltung von Webstandards zu verfolgen, oder sich nicht sonderlich mit Themen wie der Gleichstellung zu befassen. Seit der Version 1.5 ist diese Verantwortung, oder besser – die Machbarkeit – wieder ganz bei Ihnen.

Da nun jegliche Anpassungen (sog. Overrides) der Standard-Ausgaben über das Template in die Webseite eingebunden werden, erübrigen sich Probleme wie beispielsweise das versehentlichen Überschreiben von veränderten Systemdateien bei einer Aktualisierung durch einen Administrator.

MVC Grundlagen

Model/View/Controller, oder ins Deutsche übersetzt „Modell/Präsentation/Steuerung“ ist ein Architekturmuster aus der Software-Entwicklung, bestehend aus den Schichten; Datenmodell (engl. model), Präsentation (engl. view) und Programmsteuerung (engl. controller). Ziel des Musters ist ein flexibler Programmentwurf, der eine spätere Änderung oder Erweiterung erleichtert und eine Wiederverwendbarkeit der einzelnen Komponenten ermöglicht.

Für den Web-Entwickler ist eigentlich nur die Präsentationsschicht (View) von Interesse. Sollten sie dennoch neugierig sein, finden Sie in den weiterführenden Links eine ausführlichere Beschreibung dieses Konzepts.

Weitere Informationen: Model View Controller

Die Verschiedene Erweiterungstypen innerhalb von Joomla! generieren ihre Ausgabe auf unterschiedliche Weise.

Wie Sie sicher bereits wissen sind Komponenten die umfangreichste Form von Erweiterungen. Am Beispiel der Artikelverwaltung (com_content) sehen Sie, auf welch vielfältige Weise Artikel, oder wenn Sie so möchten auch Beiträge, dargestellt werden können. So haben Sie die Wahl Artikel innerhalb eines Bereichs, einer Kategorie oder den Beitrag direkt anzeigen zu lassen. Diese Unterteilung der Darstellung wird „View“ genannt und ist die Umsetzung der Präsentationsschicht aus dem MVC Konzept.

Komponenten haben häufig mehr als eine solche „View“. Dennoch sind es nicht die „Views“ die für die eigentlichen Ausgaben verantwortlich sind. Es gibt folglich eine weitere Unterteilung in sogenannte „Layouts“, wobei eine „View“ wiederum mehrere „Layouts“ besitzen kann.

Jede View bereitet nun die über das Model erhaltenen Informationen auf und stellt sie dem Layout oder den Layouts zur Verfügung. Nehmen wir erneut das Beispiel der Artikelverwaltung …

Für die Anzeige von Beiträgen innerhalb einer Kategorie gibt es zwei Darstellungsmöglichkeiten. Zum einen wäre da das „Kategorie-Blog“ Layout und als Alternative die „Kategorie-Liste“. In beiden Fällen werden die gleichen Informationen verarbeitet, jedoch auf unterschiedliche Weise ausgegeben.

Die Ausgabe von Modulen hingehen ist recht überschaubar. Generell besitzen Module keine Views, jedoch erlauben sie die Verwendung von Layouts, welche beispielsweise als Option innerhalb der Moduleinstellungen geändert werden können.

Unterscheidung zwischen Template und Layout

Während Templates einen strukturellen Rahmen für die Seiten Ihrer Internetpräsenz festlegen, sind es die Views oder Layouts einer Komponente oder eines Moduls, welche für die eigentliche Ausgabe von Inhalten zuständig sind.

Das folgende Bild zeig die Struktur und den Aufbau eines typischen Joomla! Templates (rhuk_milkyway). Um die Modulpositionen eines Templates sichtbar zu machen fügen Sie ans Ende der Adresse Ihrer Seite die Zeichenfolge „index.php?tp=1“ ein.

BILD

Wie bereits erwähnt werden die Inhalte der Positionen im Template durch die Layouts der Erweiterungen bestimmt.

Zusatzinformationen

Wenn auch nicht zwingend dem MVC Konzept zugehörig, gibt es zwei weitere Methoden zur Beeinflussung der Darstellung.

Hier im Wiki befindet sich unter dem Punkt Joomla! Programmierung Templates eine detaillierte Beschreibung zu den kurz vorzustellenden „Modul Chromes“. Darunter auch eine Anleitung zum Erstellen eigener „Chromes“. Das jeweilige Chrome, oder auch - der Rahmen in dem ein Modul eingebunden ist, wird beim einfügen einer Modulposition in der  index.php des Templates über das „style“ Attribut im jdoc include Tag festgelegt. Sollte Ihnen das gerade zu schnell gegangen sein folgt zur Veranschaulichung ein Beispiel, dass Sie sicher bereits schon einmal gesehen haben werden.

<jdoc:include type="modules" name="left" style="xhtml" />

Welche Ausgabe durch die sechs von Joomla! bereits unterstützten „Chromes Styles“ erzeugt wird, zeigt die folgende Grafik.

GRAFIK

Ein- oder ausfahrbare Menüs oder Anmeldeformulare wären ein Beispiel für eigens erstellte Chromes wie sie auch im ja_purity Template zu finden sind.

Ein weiterer Ansatz sind die Kontrollelemente welche für die Steuerung von mehrseitigen Ansichten benutzt werden (Pagination). Dazu später mehr.

Ausgabetypen der Komponenten und überschreiben von Layout Dateien

Zum besseren Verständnis der Overrides ist es notwendig sich die Dateistruktur von Komponenten anzusehen. Andere Bereiche außer acht gelassen, widmen wir uns dem Verzeichnis  views. Dazu ein Auszug der Verzeichnisstruktur der Artikelverwaltung (com_content).

 components

^|_  com_content

^|_  views

^|_  article

^|_  tmpl

^|_  default.php (Standard Layout)

^|_  form.php (Formular Layout)

^|_  view.html.php (View für die Darstellung von Html Inhalten)

^|_  view.pdf.php (View für die Darstellung von PDF Inhalten)

^|_  category

^|_  tmpl

^|_  default.php (Standard Layout)

^|_  default_items.php (Standard Layout Unteransicht)

^|_  blog.php (Blog Layout)

^|_  blog_items.php (Blog Layout Unteransicht)

^|_  blog_links.php (Blog Layout Unteransicht)

^|_  view.html.php (View für die Darstellung von Html Inhalten)

^|_  view.feed.php View für die Darstellung von RSS Feeds)

Wie hier zu sehen befinden sich die Views in einem separaten Verzeichnis. Die Artikelverwaltung besitzt drei weitere Views: archive, frontpage und section.

AusgabeTypen

Wenn wir von einer View sprechen, dann ist mit großer Wahrscheinlichkeit die Datei view.html.php gemeint. Der Dateiname folgt einer Konvention und variiert je nach Ausgabe-Typ. Mögliche Ausgabe-Typen sind: view.html.php, view.feed.php, view.pdf.php, view.raw.php oder view.error.php. Das bedeutet, wann immer eine der genannten Ausgabeformen angefragt wird, erwartet das System die entsprechende Datei. Weitere Informationen hierzu finden Sie in der Api Dokumentation unter JDocument. Werfen Sie auch einen Blick in das Verzeichnis /libraries/joomla/document.

Am ehesten ist dieser Vorgang nachvollziehbar, wenn Sie in der Konfiguration Ihres Systems suchmaschinenfreundliche URLs aktivieren. Dabei sollte die Optionen „mod_rewrite nutzen“ sowie „Dateiendung an URL fügen“ angewählt sein. Das Resultat könnte zum Beispiel so aussehen:

http://domain/sport.html http://domain/sport.feed http://domain/sport/rudern.html http://domain/sport/rudern.pdf

Hinweis: Unter Umständen funktioniert die Aktivierung suchmaschinenfreundlicher URLs nicht in einer lokalen Testumgebung.

Die Ausgabe der Adresse variiert selbstverständlich je nachdem wie Sie Ihr System konfiguriert haben. Der eigentliche Punkt jedoch ist, dass „sport.html“ intern die view.html.php der Kategorie verwendet, während „sport.feed“ für die Bereitstellung eines RSS Feeds auf die Datei view.feed.php zurückgreift. Als Anmerkung hierzu: Zum jetzigen Zeitpunkt ist es nicht möglich die Ausgabe von Feeds oder PDF anzupassen. Dies gilt jedoch nicht für die Ausgabe von Html und an dieser Stelle kommen die „Layouts“ ins Spiel.

Layouts Die Layouts befinden sich, vorausgesetzt die Erweiterung hält sich an das MVC Prinzip, in dem Verzeichnis /tmpl unterhalb einer View. Jede der PHP Dateien repräsentiert ein solches Layout.

Beispiele: Die Datei article/tmpl/default.php entspricht dem standard Layout eines Artikels. Bearbeitet man einen Artikel wird im Controller der Artikelverwaltung der View mitgeteilt die Datei article/tmpl/form.php zu laden. Ähnlich verhält es sich mit der Kategorie Ansicht, in der die gleichen Informationen zu den Artikeln entweder als Liste category/tmpl/default.php, oder als Blog category/tmpl/blog.php ausgegeben werden.

Verständlicher wird das Zusammenspiel zwischen Views und deren Layouts wenn wir uns der Erstellung eines neuen Menüpunktes widmen. Der untere Bildausschnitt zeigt eine Baumstruktur der Views und dessen Layouts aus der Artikelverwaltung.

BILD

Vielleicht ist Ihnen aufgefallen, dass einige Layouts wie pagebreak.php nicht aufgeführt wurden und sich weiterhin eine gleichnamige XML Datei im /tmpl Verzeichnis befindet. Im Kapitel Komponenten Parameter gehen wir näher auf die Optionen dieser XML Dateien ein und erklären unter anderem wie Layouts oder auch ganze Views versteckt werden können.

Mit den erworbenen Kenntnissen über die Zusammenhänge der Dateien sind wir nun in der Lage zum Erstellen eigener Overrides überzugehen.

Kopieren oder Erstellen von Layouts Overrides Joomla! sucht und benutzt Layout Overrides im /html Verzeichnis des jeweils aktiven Template. Das bedeutet, dass auch wenn Sie für eine bestimmte Erweiterung ein Override erstellt haben, dies nicht automatisch für alle installierten Templates gillt. Werfen wir nun einen Blick in die standard Templates von Joomla!.

Im Verzeichnis /templates/rhuk_milkyway/html befinden sich zwar die Dateien modules.php und pagination.php, jedoch gibt es im Template rhuk_milkyway sonst keine Overrides für Komponenten oder Module. Im Beez Template hingegen werden weitestgehend alle Ausgaben der Basis-Erweiterungen über Overrides gesteuert. Das JA Purity Template stellt auch einige Overrides bereit, allerdings beschränken diese sich auf nur wenige Layouts.

Die notwendige Struktur für Layout Overrides sehen wir am Beispiel des Templates Beez: /templates

   /beez
       /html
           /com_content		(Name der Komponente)
               /articles		(Name der View)
                   default.php	(Name des jeweiligen Layouts)
                   form.php

/html/com_name_der_komponente/name_der_view/name_des_layouts.php

Die Dateistruktur eines Overrides entspricht annähernd der einer Komponente. Da wir nur Layouts überschreiben können, entfällt lediglich das Verzeichnis /tmpl. Wie oben kurz angedeutet besitzt das rhuk_milkyway Template selbst keine Overrides für die Ausgabe von Komponenten. Um eine Alternative zur standard Darstellung eines Artikels zu erzeugen, kopieren Sie die Datei /components/com_content/views/article/tmpl/default.php in das Verzeichnis /templates/rhuk_milkyway/html/com_content/article/default.php. Sofern die Verzeichnisstruktur nicht vorhanden ist, muss diese natürlich erstellt werden.

Die gleiche Vorgehensweise ließe sich auf die Blog Ansicht anwenden. Dazu wird die Datei /components/com_content/views/category/tmpl/blog.php nach /templates/rhuk_milkyway/html/com_content/category/blog.php kopiert. Anschließend können die Dateien den eigenen Bedürfnissen, oder auf die eines Kunden angepasst werden. Achten Sie dennoch darauf vorhandene Parameter Abfragen zu berücksichtigen. Entgegen dem Hinweis aus dem original Text, selbst entscheiden zu können ob und welche Parameter für Sie von Bedeutung sind, kann das Entfernen oder anderweitige Verwenden von diesen Schaltern später für Verwirrung sorgen. Das trifft dann zu, wenn ein Benutzer im Backend versucht eine Option zu aktivieren, sich aber keine Auswirkungen darauf auf der Frontpage zeigen.

Unter-Layouts überschreiben Neben den eigentlichen Layouts findet man in der Frontpage oder Kategorie View der Artikelverwaltung eine Gruppe von Dateien mit gleichlautender Anfangsbezeichnung.

Das Blog-Layout besitzt drei solcher Dateien. Schaut man nun in die blog.php wird deutlich wie die Unter-Layouts mit Hilfe der loadTemplate() Methode geladen werden.

echo $this->loadTemplate('item') // blog_item.php echo $this->loadTemplate('links') // blog_links.php

Der Name des Basis-Layouts in dem wir uns befinden, dient als Präfix und ist innerhalb der View bekannt. Es reicht also aus das Unter-Layout direkt und ohne Angabe dieses Präfixes zu laden.

Bereits am Beispiel des Templates JA Purity konnten wir sehen, dass man keineswegs gezwungen ist alle Layouts einer View zu überschreiben. Sofern kein Override existiert wird Joomla! weiterhin die nativen Layouts der View einer Erweiterung laden.

Modul Layout Overrides

Module folgen wie alle Erweiterungen innerhalb Joomla! einer bestimmten Verzeichnis- und Dateistruktur. /modules

   /mod_latest_news
       /tmpl
           default.php		(Layout)
       helper.php		(Helper Klasse des Moduls)
       mod_latest_news.php	(Modul Einstiegspunkt)
       mod_latest_news.xml	(XML Manifest)

Für Module existiert unterhalb des Hauptverzeichnisses wie schon bei den Views einer Komponente ein /tmpl Verzeichnis. In Abhängigkeit der Funktionalität des Moduls finden sich dort eine oder mehrere Layout Dateien. Hinweis: Nicht wenige Module die für Joomla! verfügbar sind halten sich nicht an diese Vorgaben. Prüfen Sie deshalb vorher wie das Modul die Ausgabe generiert. Wie ein Layout Override eines Moduls innerhalb des Templates aussieht zeigt die folgende Darstellung.

/templates

   /beez
       /html
           /mod_latest_news	(Name des Moduls Stammverzeichnisses)
               default.php		(Layout)

/html/mod_name_des_moduls/name_des_layouts.php. 

Kontrollelemente für mehrseitige Ansichten

Zu guter Letzt schauen wir uns, wie Anfangs erwähnt, die Anpassung der Ausgaben für Kontrollelement von mehrseitigen Ansichten (Pagination) an.

BILD

Im Verzeichnis /html des Templates BEEZ befindet sich eine bereits angepasste und gut dokumentierte Datei mit der Bezeichnung pagination.php. Innerhalb dieser Datei stehen vier Funktionen für verschiedene Ausgaben der Kontrollelemente zur Verfügung.

pagination_list_footer() Diese Funktion generiert eine Auswahlliste mit der die Anzahl der anzuzeigenden Artikel oder Inhalte pro Seite gesetzt werden kann..

pagination_list_render() Innerhalb von pagination_list_render() werden die Seitenzahlen, sowie die Start, Ende und Vor/Zurück Links generiert.

pagination_item_active() Diese Funktion wirkt sich auf alle aktiven Links innerhalb der Kontrollelemente aus.

pagination_item_inactive() Wie der Name vermuten lässt kann hier die Ausgabe inaktiver Elemente beeinflusst werden.

Spickzettel Beispiele zu allen in diesem Artikel behandelten Themen zur Anpassung der Ausgaben finden sich in den Core- Erweiterungen und Templates die Joomla! nach der einer Standardinstallation mitbringt.

Themen Auswahl

Ausgabetypen der Komponenten und überschreiben von Layout Dateien Um eine alternative Ausgabe für die Artikelansicht zu erstellen kopieren Sie die Datei: /components/com_content/views/article/tmpl/default.php nach: /templates/NameDesTemplate/html/com_content/article/default.php

Weitere Informationen LINK

Modul Layout Overrides Kopieren Sie das Modul Layout von: /components/NameDesModuls/tmpl/default.php nach: /templates/NameDesTemplate/html/NameDesModuls/default.php Weitere Informationen LINK

Modul Chrome Die Erstellung oder Anpassung von Modul Styles wird im Bereich Joomla! Programmierung | Programmierung | Templates ausführlich behandelt.

Weitere Informationen LINK

Kontrollelemente für mehrseitige Ansichten Eine Beispieldatei für die Anpassung der Pagination findet sich unter: /templates/beez/html/pagination.php

Fazit

Auch wenn dieser Artikel nicht die einzige Übersetzung des Textes von Andrew Eddie zum Thema Template Overrides in Joomla! 1.5 ist und der Erscheinungstermin für die Version 1.6 mit weiteren Neuerungen näher zu rücken scheint, so hoffen wir doch Ihnen auf verständliche Weise die Prinzipien und Vorteile der MVC Strukur, sowie die Möglichkeit der Template Overrides näher gebracht zu haben.