Da wir in den letzten Artikeln eine Produktdatenbank (Contao: Eigenen Backend-Menüpunkt), sowie eine Ausgabe der Daten im Frontend (Contao: Ausgabe für eingenen Menüpunkt) erstellt haben, ist es nun an der Zeit das ganze zu verfeinern. Heute soll aus unserer Ausgabe eine Liste werden. Zusätzlich erstellen wir eine Detailseite für die zusätzlichen Informationen der Produkte. Auch hierfür legen wir wieder ein neues Inhaltselement an. Der aufmerksame Leser wird bemerken, dass sich viele Dinge wiederholen.

Ordnerstruktur

Hier noch einmal die Ordnerstruktur aus dem Artikel "Contao: Ausgabe für eingenen Menüpunkt". Hier hat sich diesmal nichts geändert, da alle Verzeichnisse bereits vorhanden sind.

Config

In die Datei config/config.php fügen wir nun unser neues Inhaltselement ein.

DCA

Hier müssen wir nun zwei Dinge tun. Zum einen müssen wir eine Palette für unser Inhaltselement anlegen. Dies ist zwar nicht nötig aber wir wollen auch in diesem Inhaltselement wieder die Contao-Standard-Felder anzeigen. Zum anderen müssen wir das Inhaltselement für die Liste um eine Weiterleitungsseite erweitern.

In Zeile 10 wurde nach dem Feld headline folgendes eingefügt: {redirect_legend},jumpTo;. Die Definition des Felds finden wir ab Zeile 13. In Zeile 9 steht nun die neue Palette.

Languages

Selbstverständlich benötigen wir auch wieder einen Eintrag in der Sprachdatei für unser Feld. Da es das erste Feld der Tabelle tl_content ist, welches wir anlegen, erstellen wir die Datei languages/de/tl_content.php

In Zeile 11 befindet sich der Eintrag für das Feld und in Zeile 15 der für die Legende. Da die genauen Zusammenhänge bereits im Artikel "Contao: Ein eigenes Inhaltselement" erläutert wurden, spare ich mir dies hier.

Im Augenblich wird unser neues Inhaltselement im Auswahlfeld "Typ" noch mit dem Array-Key aufegführt. Dies ändern wir, in dem wir die Datei languages/de/default.php um folgenden Eintrag ergänzen:

Autoload

Da auch für dieses Inhaltselement wieder eine Klasse benötigt wird, wird auch wieder ein Eintrag in der Datei config/autoload.php benötigt. Wir erweitern die Datei also entsprechend und setzen direkt unter die Klasse unseres letzten Inhaltselements die neue Klasse. Weiterhin tragen wir auch ein Templte für die neue Ausgabe ein. Alles zusammen sollte dann so aussehen:

Die Ausgabeklasse

Wie die Klasse heißt und wo sie sich befinden soll, haben wir ja gerade festgelegt. Wir erstellen nun die entsprechende Datei: classes/elements/ContentProductDetails.php.

In Zeile 16 wird das Templat für die Detailseite gesetzt. In Zeile 51 wird mittels \Contao\Input::get('id') die übergebene ID ausgelesen. Ist diese vorhanden, wird in Zeile 54 die Methode für das Laden der Daten aufgerufen und das Ergbenis an das Template übergeben. In Zeile 66 wird mit der ID der entsprechende Datensatz aus der Tabelle tl_products geladen.

Templates

Zunächst erstellen wir das Template für die Detailseite templates/ce_product_details.html5. Es ähnelt dem Template aus dem Artikel "Contao: Ausgabe für eingenen Menüpunkt", nur dass wir hier keine while-Schleife haben, da nur ein Produkt ausgegeben wird.

Nun müssen wir noch das Template für die Liste überarbeiten: templates/ce_product.html5

Link erstellen

Im Template der Liste (templates/ce_product.html5) soll in Zeile 11 der Link ausgegeben werden. Bis jetzt steht dort aber nur die ID der Seite. Um dies zu ändern müssen wir die Ausgabeklasse classes/elements/ContentProduct.php anpassen.

In Zeile 54 wird die Methode für die Erstellung des Links aufgerufen und das Ergebnis an das Template übergeben. Der Link wird ab Zeile 77 erstellt. Diese Erstellung ist sehr rudimentär, es wird z.B. nicht berücksichtigt, ob Contao in einem Unterordner installiert ist. Es soll aber zur Demonstration der Funktionsweise erst einmal reichen.

Wenn wir nun die Liste aufrufen, werden uns die Links zur Detailseite präsentiert. Wird einer davon angeklickt, gelangen wir zur Detailseite. Dort stehen uns dann alle Infos des Produkts zur Verfügung.