15 verschiedene Feldtypen im CMS Custom Fields in Joomla! 3.7

Im Administratorenbereich des Open-CMS Joomla! gibt es eine entscheidende Neuerung. Mit Version 3.7 können nun selbstständig Eingabefelder, sogenannte „Custom Fields“, erstellen und individuell auf der Website anzeigen lassen. Aktuell sind 15 Feldtypen verfügbar, Tendenz steigend.

Anbieter zum Thema

PresseBox - unn | UNITED NEWS NETWORK GmbH

Entwickler, die mit Joomla! 3.7 arbeiten, arbeiten besonders flexibel. Im Administratorenbereich finden sie ganze 15 Feldtypen vor. Diese lassen sich der Übersicht halber in Feldgruppen zusammenfassen. Zudem können Nutzer ihre eigenen Felder verschiedenen Kategorien oder Zugriffsebenen zuweisen.

Beim Erstellen von Beiträgen werden die Felder dann ausgefüllt. Diese eigenen Felder, oder auch „Custom Fields“, unterstützt Joomla! 3.7 aktuell bei „Inhalten“, „Kontakten“ und „Benutzern“; nach ihnen kann man jetzt auch dediziert suchen.

Wann helfen mir eigene Felder?

Die Möglichkeiten, die eigene Felder eröffnen, sind anhand eines Beispiels besser zu verstehen: Der Autor eines Blogs möchte eine Liste der Bücher, die er gerade liest, auf seiner Website darstellen.

Neben einer kurzen Rezension des Buches sollen Autor, Erscheinungsdatum, Verlag, ISBN und ein Link zur Website des Autors dargestellt werden. Natürlich ließen sich diese Informationen direkt im Text des Beitrags einfügen, aber eine einheitliche, besondere Formatierung wäre mühselig. Hier kommen die eigenen Felder zur Hilfe.

Im ersten Schritt ruft der Blogger das Joomla!-Backend auf. Unter „Inhalt“ -> „Kategorien“ legt er die Kategorie „Bücher“ an. Seit Version 3.7 stehen ihm unter „Inhalt“ zwei neue Menüpunkte zur Verfügung: Felder und Feldgruppen. Das bedeutet, eigene Felder lassen sich einzeln anlegen oder in einer Feldgruppe zusammenfassen. Um die Verwaltung der Felder komfortabler zu machen, legt der Blogger die für die Bücherliste benötigten Felder in einer eigenen Feldgruppe „Bücher Infos“ an:

Jetzt erstellt der Blogger die einzelnen Felder: unter „Inhalt“ -> „Felder“ -> „Neu“. Das erste Feld ist „Verlag“. Im Reiter „Allgemein“ wird der Feldtyp gewählt; in diesem Fall „Text“, da hier der Name des Verlags eingetragen werden soll. Das Feld ordnet er jetzt der Feldgruppe „Bücher Infos“ und der Kategorie „Bücher“ zu. Das Zuordnen verhindert, dass die Felder in Beiträgen erscheinen, die nicht zur Kategorie „Bücher“ gehören.

Im Reiter „Optionen“ lassen sich zudem Platzhalter und CSS-Klassen definieren. Außerdem kann der Blogger das Anzeigen der Beschriftung, den Einsatzbereich und die automatische Anzeige der Felder einstellen.

Wenn die Beschriftung des Feldes angezeigt werden soll, wird die Ausgabe „Verlag: Mein Verlag sein.“ Ohne Beschriftung wird nur „Mein Verlag“ stehen. Der Einsatzbereich dieser Beschriftung kann variieren. Beispielsweise lassen sich die Felder auf der Website, nur im Administratorbereich oder in beiden Bereichen anzeigen.

Mit einer automatischen Anzeige definiert der Blogger die Position der Felder im Beitrag. Zur Auswahl stehen „Nach Beitragstitel“, „Vor Beitrag“, „Nach Beitrag“ und „Nein“. Nach dem gleichen Prinzip kann der Anwender die Felder „Erscheinungsdatum“, „Autor“ und „ISBN“ anlegen.

Um jetzt die Felder befüllen zu können, müssen die Beiträge angelegt werden. Unter „Inhalt“ -> „Beiträge“ -> „Neu“ erstellt man das erste Buch. „Titel“ ist natürlich der Titel des Buches. Im Inhalt schreibt der Blogger seine Rezension. Da die neuen Felder nur in Beiträgen der Kategorie „Bücher“ angezeigt werden, muss der Beitrag der entsprechenden Kategorie zugeordnet werden. Erst dann erscheint zusätzlich zu den üblichen Reitern im Beitrag ein Tab „Bücher Infos“. Hier sind auch die zuvor erstellten Felder ersichtlich. Die Felder können jetzt passend befüllt werden.

Um die Ergebnisse sichtbar zu machen, legt der Blogger im Anschluss einen Menüpunkt „Bücher“ als Bloglayout der Kategorie „Bücher“ an. Auf der Website sieht man jetzt die Bücherliste mit den zusätzlichen Infos.

Wie positioniere ich die Felder?

Bei allen Feldern wählte der Blogger die automatische Anzeige auf „Vor Beitrag“. Jetzt betrachtet er die anderen Möglichkeiten näher: Das Feld „Autor“ wird auf „Nach Beitragstitel“ und das Feld „ISBN“ auf „Nach Beitrag“ gestellt. Im vorangestellten Bild sehen wir das Ergebnis. Die Inhalte lassen sich mit wenig Nacharbeit deutlich strukturierter und übersichtlicher darstellen.

Jetzt kommen noch die zuvor erwähnten CSS-Klassen ins Spiel. Dem Feld „Autor“ wird die Ausgabeklasse „b-autor“ zugewiesen. Für die anderen Felder verwendet man dementsprechend die Klassen „b-datum“, „b-verlag“ und „b-isbn“. Das folgende Code-Snippet zeigt eine mögliche Formatierung mit zentriertem Autorenfeld, gefetteten Details und kursiver Ausgabe der ISBN.

Wie verwende ich weitere Feldtypen?

Bis jetzt hat unser Blogger nur Textfelder verwendet. Für die Website des Autors benötigt er aber ein Feld, das automatisch eine Verlinkung erstellt. Dafür gibt es den Feldtypen „URL":

Die CSS-Definition wird anschließend passend ergänzt:

Hier gibt es eine automatisch erstellte Verlinkung zur Website des Autors bzw. des Buches.

Automatische Anzeige ausschalten

Ein Blick auf den Quellcode zeigt, dass die Felder in der folgenden Abbildung als Definitionsliste eingefügt wurden.

Es gibt jedoch eine Möglichkeit, die Felder anders anzuzeigen. Dafür muss der Anwender die automatische Anzeige ausschalten und die Felder direkt im Beitrag einfügen. Dafür gibt es in Joomla! 3.7 einen neuen Button im Editorbereich des Beitrages.

Das Feld wird in diesem Fall als Absatz im Text eingefügt:

Es wäre auch möglich, andere Formatierungen dafür zu verwenden, z.B. „Überschrift“, „Liste“, „Tabelle“ o.Ä.

Overrides verwenden

Eine weitere Möglichkeit, Felder anders darzustellen, sind sogenannte „Overrides“. Die dazugehörige Komponente „com_fields“ bietet zwei Layouts: „field/render.php“ und „fields/render.php“. Diese lassen sich nach dem bekannten Weg der Overrides-Erstellung überschreiben: über „Erweiterungen“ -> „Templates“ -> „Templates“ -> „MeinTemplate“ -> „Overrides erstellen“ -> „Layouts“ -> „com_fields“.

Hier lässt sich die Struktur des Feldes verändern, z.B. eine nummerierte Liste statt einer Definitionsliste.

Welche weiteren Darstellungsmöglichkeiten gibt es?

Eine andere Art von „Overrides“ definiert das Aufrufen der Felder direkt im Template. Wie das funktioniert, wird in einem weiteren Anwendungsbeispiel deutlich: Unser Blogger will für seinen Blog eine News-Seite erstellen. Die dargestellten Nachrichten sollen einen Untertitel bekommen. Außerdem sollen die Quelle, eine Zusammenfassung sowie Links zu sozialen Netzwerken angezeigt werden.

Um diesen Bereich darzustellen, legt der Nutzer die Kategorie „News“ und die nötigen Felder in der Feldgruppe „News Infos“ an und weist die Feldgruppe der entsprechenden Kategorie zu. Das Feld „Untertitel“ ist ein Textfeld mit automatischer Anzeige auf „Nein“. „Quelle“ ist auch vom Typ „Text“ und wird nach dem Beitrag angezeigt. Für „Zusammenfassung“ wird ein Textbereich verwendet und vor dem Beitrag positioniert. Der Link zu Twitter soll als Icon erscheinen. Dafür wird ein Textfeld mit einem Standardwert (z.B. https://twitter.com/drmenzelit) ohne Beschriftung und ohne automatische Anzeige angelegt. Der Standardwert bringt den Vorteil, dass der Blogger den Wert nicht für jeden Beitrag ausfüllen muss.

Die News der Seite werden nun als Bloglayout angezeigt. Für die richtige Darstellung der Felder wird die Datei „com_content/category/blog_item.php“ als Override angelegt. Nach dem Titel:

soll der Untertitel angezeigt werden. Um das zu erreichen, werden einige Zeilen Code darunter eingefügt:

Der Wert „8“ bei jcfields ist die ID des Feldes, das angezeigt werden soll. Diese ID findet man im Backend in der Liste der Felder.

Am Ende der Datei wird noch der Code für das Twitter-Icon eingefügt.

Hier ist „12“ wieder die ID des Feldes.

Die nötigen CSS-Definitionen werden ergänzt:

Jetzt ist die Newsseite fertig.

Content flexibel zur Seite hinzufügen

Ein letztes Beispiel soll die enorme Flexibilität der neuen „Custom Fields“ in Joomla! 3.7 verdeutlichen: Der Blogger möchte seinen Blog mit einer Sammlung von Kochrezepten ergänzen. Wie in den anderen Beispielen wird zunächst eine Kategorie „Rezepte“ erstellt.

Für die Rezeptbeiträge speichert er die Feldgruppe „Rezept-Infos“ mit den Feldern „Portionen“ und „Arbeitszeit“ als Textfelder ohne automatische Anzeige. Um die Rezepte korrekt darzustellen, wird ein Override von der Artikelansicht („com_content/views/article/tmpl/default.php“) als alternatives Layout „rezept.php“ unter „meinTemplate/html/com_content/article/“ angelegt. Die Rezept-Infos sollen als Spalte neben dem Rezept erscheinen. Dafür wird der Bereich innerhalb von <div itemprop="articleBody"> umgestaltet:

Somit ist die Positionierung der Felder auch außerhalb der vordefinierten Plugin-Events („afterDisplayTitle“, „beforeDisplayContent“ und „afterDisplayContent“) möglich.

Die 15 Feldtypen von Joomla! 3.7 im Überblick

• Kalender: Textfeld zum Eintragen eines Datums. Ergänzender Pop-up-Kalender zum Auswählen des Datums.

• Kontrollkästchen: Ein oder mehrere Werte können eingetragen werden.

• Farbe: Farbauswahl-Box (Color picker).

• Editor: Eine Auswahlliste der vorhandenen WYSIWYG-Editoren. Ergebnis ist ein Textbereich mit dem ausgewählten Editor.

• Zahlen: Auswahlliste von Zahlen zwischen einem Minimum und einem Maximum.

• Listen: Auswahlliste von selbstdefinierten Werten.

• Bilder hinzufügen: Auswahlliste von Bildern aus einem definierten Ordner.

• Medien: Bietet Zugriff auf den Media Manager, um Bilder auszuwählen oder hochzuladen.

• Radio: Radio-Buttons zur Auswahl von verschiedenen Optionen.

• SQL: Auswahlliste von Ergebnissen einer SQL-Abfrage der Joomla!-Datenbank.

• Text: Textfeld für die Eingabe von Daten.

• Textbereich: Textbereich für die Eingabe von einem mehrzeiligen Text.

• URL: Eingabe-Feld für URLs.

• Benutzer: Auswahlliste für Benutzer. Das Feld zeigt den Benutzernamen und speichert die Benutzer-ID.

• Benutzergruppe: Auswahlliste der verfügbaren Joomla!-Benutzergruppen.

Weitere Informationen zu den „Custom Fields“ in Joomla! finden sich auf der offiziellen Dokumentationsseite

* Viviana Menzel arbeitet bei Joomla! Deutschland.

(ID:44730113)