Beitragsseiten

Benutzerdefinierte Felder designen

Wir lassen die Felder automatisch als Infoblock erscheinen → Redakteur schreibt nur noch Inhalt.

Ziel

Unter jedem Artikel automatisch diese Anzeige:

Information	Wert
Termin	15.10.2026
Preis	1290 €
Raum	B-315
Unterricht	Hybrid
Online	Ja
Dozent	Max Mustermann

1. Wo die Ausgabe herkommt

Joomla lädt für jeden Artikel diese Datei:
/components/com_content/tmpl/article/default.php

Die Felder selbst werden hier eingebunden:
/layouts/joomla/content/fields/render.php

Wir überschreiben genau diese Ausgabe — update-sicher.

2. Override erstellen (Backend)

Im Joomla Backend:
System → Templates → Site Templates → Cassiopeia → Overrides → com_content → article

Joomla erzeugt jetzt:
/templates/cassiopeia/html/com_content/article/default.php

UND das ist jetzt DEINE Version.

2a. Override erstellen (Step by Step)

Ziel

Wir erstellen ein Artikel-Override. Danach existiert diese Datei:
/templates/cassiopeia-extended/html/com_content/article/default.php

Und genau DIE bestimmt dann die Artikelanzeige auf:
https://joomla6.rneuhoff.de/irgendein-artikel

Schritt 1 —
Backend öffnen

https://joomla6.rneuhoff.de/administrator

Einloggen

Schritt 2 —
Sicherstellen welches Template aktiv ist

Menü:
System → Site Templates → Styles

Du musst sehen:
Cassiopeia-extended ★ (Standard)

Nur das Stern-Template wird verwendet.

Schritt 3 —
In das richtige Template wechseln

Jetzt NICHT auf „Cassiopeia“ klicken!, sondern auf:
System → Site Templates → Cassiopeia-extended

URL:
https://joomla6.rneuhoff.de/administrator/index.php?option=com_templates&view=style&client_id=0&template=cassiopeia-extended

Schritt 4 —
Override-Generator öffnen

Oben Tabs:
Editor | Overrides | Layouts | Template

Klicke auf:
Overrides

Schritt 5 —
Artikel-Layout erzeugen

Linke Spalte: Components

→ com_content
→ article
→ default

Einmal anklicken.

❗ Joomla erstellt jetzt automatisch Dateien — ohne Meldung.

Schritt 6 —
Kontrollieren ob Datei wirklich existiert

Jetzt: System → Site Templates → Cassiopeia-extended → Editor

Links Ordner öffnen (CSS):

html
└─ com_content
└─ article
└─ default.php

Das ist dein Override.

Physischer Serverpfad (All-inkl)

Auf dem Webspace liegt die Datei hier:
/www/htdocs/DEIN_ACCOUNT/joomla6.rneuhoff.de/templates/cassiopeia-extended/html/com_content/article/default.php

Vergleich:

Typ	Pfad
Original Joomla	/components/com_content/tmpl/article/default.php
Dein Override	/templates/cassiopeia-extended/html/ com_content/article/default.php

Joomla benutzt jetzt nur noch dein Override.

Schritt 7 —
Funktion testen

Datei öffnen und GANZ OBEN einfügen:

<div style="background:red;color:white;padding:10px;">
Override funktioniert
</div>

Speichern

Frontend Artikel aufrufen:
https://joomla6.rneuhoff.de/index.php/home

Wenn du den roten Balken siehst → alles korrekt.Danach wieder löschen.

3. Jetzt Felder als Tabelle ausgeben

Öffne:
/templates/cassiopeia/html/com_content/article/default.php

Suche die Zeile:
echo $this->item->jcfields;
oder
echo FieldsHelper::render('com_content.article', 'fields', ['item' => $this->item]);

Diese ersetzen wir komplett.

4. Neue Tabellen-Ausgabe einbauen

Ganz unten vor:
</div>

einfügen:

<?php if (!empty($this->item->jcfields)) : ?>
<table class="custom-fields-table">
<tbody>
<?php foreach ($this->item->jcfields as $field) : ?>
<?php if (!empty($field->value)) : ?>
<tr>
<th><?php echo htmlspecialchars($field->title); ?></th>
<td><?php echo $field->rawvalue; ?></td>
</tr>
<?php endif; ?>
<?php endforeach; ?>
</tbody>
</table>
<?php endif; ?>

Speichern.

5. Tabelle hübsch machen (CSS)

Datei: /templates/cassiopeia-extended/css/user.css
anlegen oder erweitern:

.custom-fields-table {
width: 100%;
border-collapse: collapse;
margin-top: 30px;
font-size: 0.95rem;
}

.custom-fields-table th {
background: #2c5aa0;
color: white;
text-align: left;
padding: 10px;
width: 30%;
}

.custom-fields-table td {
background: #f5f7fb;
padding: 10px;
border-bottom: 1px solid #d0d7e2;
}

.custom-fields-table tr:nth-child(even) td {
background: #e8edf5;
}

Cache leeren:

System → Wartung → Cache leeren
Browser STRG + F5

6. Was jetzt im Frontend passiert (sichtbares Ergebnis)

Angenommen dein Artikel hat folgende Felder:

Feldname	Inhalt
Text	Joomla Einführung
Kalender	12.02.2026
Checkbox	Ja
Farbe	Blau
Zahl	25
Benutzer	Reiner

Vorher (Standard Joomla)
Unordentlich untereinander:

Text: Joomla Einführung
Kalender: 12.02.2026
Checkbox: Ja
Farbe: #0000ff
Zahl: 25
Benutzer: Reiner

Jetzt (Frontend Anzeige)
Der Artikel zeigt automatisch:

Eigenschaft	Wert
Text	Joomla Einführung
Kalender	12.02.2026
Checkbox	Ja
Farbe	Blau
Zahl	25
Benutzer	Reiner

Visuell:
👉 Blau hinterlegte linke Spalte
👉 Hellgraue Werte rechts
👉 Gleichmäßig wie ein Datenblatt

Das passiert automatisch bei JEDEM Artikel mit Feldern. Du musst nie wieder HTML schreiben.

7. Leere Felder nicht anzeigen

Wenn du ein Feld leer lässt → erscheint es NICHT in der Tabelle.
Das kommt von:
if (!empty($field->value))

Also kein Chaos, keine leeren Zeilen.

Ergebnis

Du hast jetzt:

strukturierte Artikeldaten
SEO-bessere Lesbarkeit
wartbare Inhalte
perfekte Darstellung ohne Editor-Gefrickel

Suche