Inhaltselemente/Module für die Frontendausgabe

Nachdem alle Komponenten für die Dateneingabe konfiguriert sind, kann die Datenausgabe bearbeitet werden. Für die Datenausgabe stehen verschiedene Möglichkeiten zur Verfügung - in dem Beispiel soll die Ausgabe über das Artikel-Inhaltselement „MetaModel-Liste“ erfolgen.

Als Vorbereitung für die Ausgabe muss eine entsprechende Seite in Contao angelegt sein mit einem Artikel, der das Inhaltelement aufnimmt. Ein neues Inhaltselement wird angelegt und folgende Einstellungen aktiviert (siehe Screenshot):

  • Elementtyp: MetaModel-Liste

  • Sortieren nach: Name

  • Anzuwendende Filtereinstellungen: Veröffentlicht

  • Anzuwendende Render-Einstellungen: FE Liste

img_contentelements_01

Nach „Speichern und schließen“ steht das Inhaltselement zur Verfügung und die Anzeige kann im Frontend geprüft werden.

Die Anzeige sollte nun den Satz „Ihre Suche lieferte keine passenden Ergebnisse.“ hervorbringen, da noch keine Daten eingeben wurden.

Für den Test der Anzeige ist es notwendig, einige Datensätze in der Mitarbeiterliste anzulegen. Dazu klickt man in der linken Navigation des Backends unter „MetaModels“ auf das Icon „img_metamodels Mitarbeiterliste“ und anschließend auf das Icon „img_new Neuer Datensatz“.

Es öffnet sich die Eingabemaske mit den vorgegebenen Feldern (Attributen), welche mit den ersten Daten gefüllt werden kann (siehe Screenshot).

img_contentelements_02

Nach „Speichern und schließen“ ist der Datensatz mit den aktivierten Attributen der Render-Einstellung „BE Liste“ (Name und Vorname) zu sehen (siehe Screenshot).

img_contentelements_03

Der Datensatz kann über das Stift-Icon wieder bearbeitet werden und über das „Auge“ wird der Status „Veröffentlicht“ gewechselt (alternativ zur Checkbox der Eingabemaske).

Die Ausgabe im Frontend sollte nun etwa wie folgt aussehen (Screenshot).

img_contentelements_04

Spielt man einige Testdaten in die Datenbank - oder gibt diese manuell ein - sieht die Mitarbeiterliste im Backend in etwa so wie in dem Screenshot aus

img_contentelements_05

und wie folgt im Frontend

img_contentelements_06

Für die Ausgabe im Frontend werden die Attribute über das Standard-Template in einzelne HTML-DIV-Container inklusive spezifischer CSS-Klassen ausgegeben. Eine Formatierung kann entweder über ein CSS erfolgen oder über eine Anpassung des Templates, so dass hier die Ausgabe als HTML-Tabelle erfolgt.

Mit einige CSS-Angaben wie z.B. die folgenden

 1     .ce_metamodel_content .item {
 2         display: table;
 3         width: 100%;
 4     }
 5     .ce_metamodel_content .item.even {
 6         background-color: #f4f2f0;
 7         border-bottom: 1px solid #d4cbc5;
 8         border-collapse: collapse;
 9     }
10     .ce_metamodel_content .item.odd {
11         background-color: #f6f6f6;
12         border-bottom: 1px solid #d4cbc5;
13         border-collapse: collapse;
14     }
15     .ce_metamodel_content .item .field {
16         display: table-cell;
17     }
18     .ce_metamodel_content .item .field.name {
19         width: 20%;
20     }
21     .ce_metamodel_content .item .field.vorname {
22         width: 20%;
23     }
24     .ce_metamodel_content .item .field.email {
25         width: 40%;
26     }
27     .ce_metamodel_content .item .field.abteilung {
28         width: 20%;
29     }

sieht die Ausgabe schon besser aus - siehe Screenshot

img_contentelements_07

Detailseite eines Datensatzes

Typischer Weise werden in der Listenansicht nicht alle Inhalte eines Datensatzes angezeigt, sondern nur diejenigen, die für eine Suche oder Auswahl notwendig sind. Den kompletten Datensatz kann man auf einer Detailseite präsentieren.

Dazu muss zunächst eine Detailseite in Contao angelegt werden - z. B. domain.tld/mitarbeiter-details.html.

In diese Seite wird ein Contentelement MM-Liste als Modul oder CE eingefügt - MetaModel ist wieder mm_employees.

Weiterhin wird ein Rendersetting für die Ausgabe benötigt - hier sollte man für die Detailseite ein separates Rendersetting „FE - Details“ anlegen. Mit einem eigenen Template kann die Ausgabe individuell gestaltet werden.

Damit auf der Seite nicht alle Datensätze sondern nur der gewünschte ausgegeben wird, ist ein entsprechender Filter notwendig. Als Filterregeln ist die „Einfache Abfrage“ zu empfehlen und als Attribut ein Alias bzw. übersetzter Alias. Zudem sind nach Bedarf noch weitere Filterregeln wie „Veröffentlicht“ o. ä. möglich. Der angelegte Filter ist in MM-Liste der Detailseite auszuwählen.

Mit einer URL wie z. B. domain.tld/mitarbeiter-details/alias/avery-amir.html sollte der entsprechende Datensatz ausgegeben werden.

Damit in der Listendarstellung automatisch die Verlinkungen zu Detailseite erzeugt werden, ist im Rendersetting der List in der Sektion „Einstellungen der Weiterleitung (jump-to)“ die Detailseite mit dem entsprechenden Filter auszuwählen. Die Ausgabe der Links im Template ist im Knoten actions.