Um ein eigenes Template programmieren zu können, muss man wissen wie das CMS seine Templates benötigt. Ich zeige euch heute anhand eines Beispiels, das kleinste funktionstüchtige und das kleinste sinnvolle Joomla-Template. Fangen wir mit den Grundlagen eines Joomla-Template an.
Grundlagen
Damit ein Template “funktioniert” sollte es den Inhalt aus der Datenbank des CMS darstellen. Für ein Joomla-Template braucht ihr eigentlich nur 2 Dateien: eine index.php und eine templateDetails.xml. Die XML-Datei ist nötig um das Template in Joomla zu installieren, hier werden auch die Eigenschaften des Templates festgelegt. Die index.php ist für die spätere Ausgabe zuständig. Hier wird festgelegt wie das HTML aussehen soll und wo der Inhalt ausgegeben wird. In Joomla gibt es zwei verschiedene “Inhaltstypen”, die Beiträge und die Module.
Das ist nicht ganz gleich wie in WordPress, hier gibt es Beiträge, Seiten und Widgets. Beiträge in Joomla können sowohl in einer Kategorie erscheinen, also als Blog, als auch einfache Seiten sein. Ein Beitrag kann sowohl in einer Kategorie ausgegeben wird, als auch gleichzeitig als Seite aufgerufen werden. Außerdem sind Module auch nicht gleich wie die Widgets in WordPress, beides gibt es in verschiedenen Typen, also einfache Text-Felder, Blog-Feeds, Slider oder Ähnliches. Wie auch immer, mit einem Modul wird in Joomla auch das Menü ausgegeben und man kann Module einzelnen Seiten im Menü zuzuordnen. Über zusätzlich Komponenten kann man sogar Module je nach Datum und Uhrzeit einblenden oder ausblenden. Außerdem können Module auf verschiedenen Modulpositionen ausgegeben werden, jedoch kann ein Modul nicht gleichzeitig auf mehreren Positionen ausgegeben werden.
Die Modulpositionen müssen in der templateDetails.xml definiert sein und im Template ausgegeben werden. Um ein funktionierendes Template zu haben, sollten wir mindestens eine Postion definieren und den Beitrag ausgeben.
Das kleinste funktionstüchtige Joomla-Template
Die ersten Zeilen sind nötig um eine valide XML-Datei zu bekommen, danach wird nur das Template benannt und ein paar Informationen angegeben. Unter <files></files> werden die zum Template gehörigen Dateien aufgezählt. Hier solltest du wirklich alle Dateien und Ordner aufzählen, nur dann kann das Template später im Joomla-Backend kopiert werden. Unter <positions></positions> werden die Modulpositionen definiert. Die Benennung der Positionen sollte nach ihrer späteren Position und Funktion im Template benannt werden. Denn mit “position‑9” kann niemand etwas anfangen, als ob du dass auswendig lernst. 😉
Die XML-Datei
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE install PUBLIC "-//Joomla! 2.5//DTD template 1.0//EN" "https://www.joomla.org/xml/dtd/2.5/template-install.dtd">
<extension version="3.1" type="template" client="site">
<name>KJT</name>
<version>1.0</version>
<creationDate>11.09.2016</creationDate>
<author>Selma</author>
<files>
<filename>index.php</filename>
<filename>templateDetails.xml</filename>
</files>
<positions>
<position>menu</position>
</positions>
</extension>Das ist die XML-Datei für das Template, das ist wirklich die minimale Version. In den meisten Templates wird die XML-Datei deutlich größer sein und noch weitere Optionen beinhalten, aber so funktioniert es schon.
Die PHP-Datei
In der PHP-Datei wird das HTML-Gerüst der Seite festgelegt. Ganz oben wird in dem einzigen wirklichen PHP-Bereich befindet sich ein Aufruf von Joomla. Hier wird geprüft ob das Skript auch korrekt aufgerufen wird, genauer gesagt wird geprüft ob das Skript sich in Joomla-Umfeld befindet. Damit Joomla im <head></head> der HTML-Strucktur einige Skripte und Informationen platzieren kann muss dieser Teil enthalten sein: <jdoc:include type="head" />. Im <body></body> der Datei wird eine Modulposition für das Menü mit <jdoc:include type="modules" name="menu" style="xhtml" /> aufgerufen. Danach werden mit <jdoc:include type="message" /> Joomla-Meldungen ausgegeben, wie z.B. Fehlermeldungen. Und dann (endlich) wird der Joomla-Beitrag ausgegeben: <jdoc:include type="component" />. Fertig.
<?php defined('_JEXEC') or die; ?>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<jdoc:include type="head" />
</head>
<body>
<jdoc:include type="modules" name="menu" style="xhtml" />
<jdoc:include type="message" />
<jdoc:include type="component" />
</body>
</html>Und das die PHP-Datei, einfach gerade genug HTML für eine Webseite. Falls du mir nicht glaubst, probier es aus. Diese beiden Datein reichen um das Template in Joomla zu installieren und zu nutzen. Die Ausgabe ist natürlich sehr primitiv und nicht sehr hübsch 😉
Das kleinste sinnvolle Joomla-Template
Anzuraten ist es auch, dass du mehr Modulpositionen im Template hast. Du kannst zwar pro Position beliebig viele Module ausgeben, aber du möchtest ja nicht alle Inhalte einfach untereinander haben. Häufig hast du mindestens noch eine Position für Bilder im Header, Menüs im Footer und Infos in der Sidebar deiner Webseite.
Um das Template wirklich nutzen zu können sollte man CSS-Dateien und auch eine JavaScript-Datei einbinden. Aber für das grundlegende Aussehen der Webseite empfiehlt es sich, am Anfang, auf ein Framework zurückzugreifen. Als Framework bezeichnet man eine Sammlung von vordefinierten Stylings für HTML-Elemente, häufig liefern solche Frameworks auch grundlegende JavaScript-Funktionalitäten mit. Als Beispiel bietet sich Bootstrap, Foundation for Sites, PURE.css, Cutstrap und Skeleton (um nur ein paar zu nennen). Der Umfang der Frameworks ist sehr unterschiedlich und leider auch die HTML-Struktur und CSS-Klassen. Welches Framework zu dir passt musst du selbst entschieden. Auf der einen Seite helfen dir die Frameworks schnell gute Ergebnisse zu erzielen, auf der anderen Seite kann du nicht immer die richtigen Voraussetzungen schaffen. Beispielsweise kannst du die Ausgabe nicht immer zu 100% beeinflussen.
Und eine Warnung muss in dem Fall auch ausgesprochen werden, weil Joomla Bootstrap 2 nutzt. Bootstrap 3 gibt es schon seit Jahren und gerade wurde die Vorabversion von Bootstrap 4 veröffentlicht. Für dich bedeutet das, dass nicht alles sofort gut aussieht weil Joomla nicht die benötigten CSS-Klassen nutzt.
Zusammengefasst: Das kleinste (sinnvolle) Joomla-Template sollte also auf jeden Fall mehr Modulpositionen enthalten, CSS für die Optik und JavaScript für Funktionen.