Hier wird beschrieben, wie man ein eigenes Frontendmodul für Contao erstellt. Im Prinzip funktioniert es genauso, wie das Erstellen eines Inhaltselements, nur das man nicht die Tabelle tl_content sondern tl_modules erweitert. Als Demonstration wird eine einfache Textbox erstellt, bei der man die Hintergrundfarbe einstellen kann.

Verzeichnisstruktur

Auf geht's! Wie immer wird als erstes die Verzeichnisstruktur für die Erweiterung unter TL_ROOT/system/modules/ angelegt. Ich nenne den Ordner für die Erweterung easy_modul.

Hier gibt es einen kleinen Unterschied zum Inhaltselement, im Ordner classes/ gibt es das Verzeichnis modules statt elements. Dies geschieht nur der Ordnung halber und ist nicht zwingend erforderlich. Mann kann seine Klassen auch direkt in classes oder einem anderen Ordner speichern.

Config

Nun wird der Eintrag des Moduls in der Datei config/config.php erstellt.

Wird nun im Backend ein neues Modul anlegen, sollte der Eintrag bereits in der Rubrik Verschiedenes in der Auswahlbox Modultyp erscheinen. Da dieser als Namen noch den Schlüssel easymodul trägt, wird gleich noch eine Übersetzung hinzugefügt. Hierzu wird die Datei languages/de/module.php mit folgendem Inhlat erstellt:

DCA

Damit im Modul auch Einstellungen vorgenommen werden können, wird nun die Datei dca/tl_module.php angelegt. Auch wenn man keine eigenen Felder anlegen will, wird die Datei benötigt, um die Palette zu erstellen.

Wird keine Palette erstellt, sind nur die Felder Titel und Modultyp vorhanden. Damit wir einene Text eingeben können, benötigen wir ein Textfeld, vorzugsweise mit TinyMCE. Da es ein solches Feld in der Tabelle tl_modules im Stantard nicht gibt, erstellen wir das Feld easy_content.

Zusätzlich erstellen wir in der selben Datei noch das Feld für die Farbe und nennen es easy_color.

Leider ist nun noch nichts von unseren Felder zu sehen. Wir müssen noch die Palette anlgen. Dies geschiegt wie bereits erwähnt ebenfalls in der Datei dca/tl_modules.php.

Hier werden einige Standardfelder verwendet, wie protected, guests und cssID. Uns interessieren aber vor allem unsere Felder, in Zeile 2. Zunächst legen wir einen Abschnitt für unsere Felder an ({content_legend}). Abschnitte sind die grünen Überschriften, man erkennt sie an den geschweiften Klammern. Dahinter notieren wir unsere Felder (,easy_content,easy_color;). Es ist wichtig, den Abschnitt mit einem Semikolon (;) zu schließen!

Damit es auch schön aussieht, fügen wir nun noch eine Übersetzung für unsere Felder und den Abschnitt (grüne Überschrift) ein. Wir legen die Datei languages/de/tl_modules.php mit folgendem Inhalt an.

Der Menüpunkt wird bisher nur mit der Schlüssel des Konfigunrationsarrays angezeigt. Um dies zu ändern, erstellen wir die Datei languages/de/modules.php mit folgendem Inhalt:

(Vielen Dank an Nick Weschkalnies für den Hinweis.)

Autoload

Nun erstellen wir den Autoload-Eintrag für unsere Ausgabeklasse. Diese werden wir im nächsten Schritt anlegen. Wir erstellen die Datei config/autoload.php und registrieren neben der Klasse auch gleich unser Template. In diesem Beispiel heißt es einfach mod_easymodul.

Ausgabeklasse

Es ist an der Zeit das Herzstück der Erweiterung zu erstellen, die Klasse für die Ausgabe unseres Moduls. Wir legen die Datei classes/modules/easymodul.php an.

Da wir im Template direkt auf die Werte aus dem Backend zugreifen können, macht die Klasse zugegebenermaßen nicht sehr viel. Da wir von \Contao\Module erben, müssen wir die Methode compile implementieren, auch wenn sie (wie in diesem Beispiel) nicht tut.

Template

Nun fehlt noch die Ausgabe in unserem Template. Wie oben in der Autoload-Datei angegeben, speichern wir es unter dem Namen templates/mod_easymodul.html5.

In Zeile 3 wird mit <?php echo $this->easy_color; ?> die Hintergrundfarbe ausgegeben und in Zeile 4 dann noch der Inhalt.

Anzeigen der Ausgabe

Damit unsere Ausgabe angezeigt wird, muss ein Modul vom Typ easymodul angelegt und in das Seitenlayout eingebunden oder über einen Artikel ausgegeben werden.