FAQ, Akkordeons und Tabs pflegen
FAQ-Blöcke führen direkt zur passenden Antwort. Akkordeons klappen unabhängige Abschnitte auf; Tabs wechseln zwischen wenigen gleichrangigen Ansichten. Wählen Sie die Form, mit der Besucher den Inhalt am leichtesten finden.
Die passende Aufteilung wählen
Verwenden Sie FAQ, wenn Besucher mehrere Fragen mit direkt erreichbaren Antworten lesen sollen. Die Core-Ausgabe stellt eine Liste mit Sprunglinks und darunter die Antworten dar. Sie klappt die Antworten nicht wie ein Akkordeon ein. Ein Akkordeon eignet sich für voneinander unabhängige kurze Abschnitte, deren Überschrift bereits erkennen lässt, was darin steht. Tabs eignen sich für wenige alternative Ansichten derselben Aufgabe, etwa „Redaktion“ und „Entwicklung“.
Eine Anleitung, deren Schritte nacheinander ausgeführt werden müssen, bleibt besser als zusammenhängender Text sichtbar. Ebenso sollten die wichtigste Kontaktmöglichkeit und zentrale Voraussetzungen nicht ausschließlich hinter einer unauffälligen Registerkarte stehen. Prüfen Sie die Aufteilung zuerst auf dem Handy: Eine Reihe langer Tab-Titel kann dort schwerer zu überblicken sein als eine einfache Gliederung mit Überschriften.
In unserer Installation stehen zwei Blöcke mit dem Namen Akkordeon zur Auswahl. Der Eintrag unter Navigation gehört zum Core. Der Eintrag unter Andere stammt aus dem Package ConcreteCMS Deutschland. Auch Tabs – Abschnittsmarkierung unter Andere ist eine Package-Funktion. Die folgenden Abschnitte benennen die jeweiligen Formulare ausdrücklich. Das Aussehen allein ist kein verlässlicher Hinweis auf die Herkunft eines Blocks.
Antworten mit dem Core-Block FAQ pflegen
Öffnen Sie die gewünschte Seite im Bearbeitungsmodus. Wählen Sie am vorgesehenen Bereich Inhalte hinzufügen → Navigation → FAQ. Im Dialog stehen für jeden Eintrag drei Felder bereit:
- Navigation Linktext: die kurze Beschriftung in der Sprungliste, beispielsweise „Öffnungszeiten ändern“.
- Titeltext: die vollständige Frage als Überschrift über der Antwort, beispielsweise „Wie ändere ich die Öffnungszeiten?“.
- Beschreibung: die Antwort im normalen Texteditor, einschließlich sinnvoller Listen und interner Verweise.
Abbildung 1: Linktext und Titel dürfen unterschiedlich lang sein. Beide müssen eindeutig dieselbe Antwort beschreiben.
Erfassen Sie zunächst eine vollständige Frage und Antwort. Ergänzen Sie weitere Einträge mit Element hinzufügen. Eintrag minimieren erleichtert den Überblick beim Sortieren; es verändert nicht den anfänglichen Zustand der Besucherausgabe. Mit dem Verschiebegriff ändern Sie die Reihenfolge. Entfernen nimmt einen Eintrag aus dem Block; prüfen Sie vorher, ob darin noch benötigte Informationen oder Links stehen.
Schreiben Sie die Antwort so, dass die eigentliche Lösung früh erscheint. Ein Verweis wie „siehe oben“ hilft nach einem direkten Sprung oft wenig. Verlinken Sie stattdessen die konkrete Anleitung oder zuständige Seite, etwa über den nativen Seitenwähler des Texteditors. Das Vorgehen erklärt Texte gliedern und interne Links setzen.
Die Core-Standardausgabe verwendet für FAQ-Titel H3. Prüfen Sie deshalb die Gliederung der umgebenden Seite. Eine gestalterisch größere Schrift ersetzt keine passende Überschriftenebene. Falls das verwendete Theme ein anderes FAQ-Template bereitstellt, kann dessen Darstellung abweichen; die redaktionellen Eingabefelder bleiben davon getrennt.
Das Core-Akkordeon einrichten
Wählen Sie Inhalte hinzufügen → Navigation → Akkordeon. Öffnen Sie im Reiter Inhalt über Element hinzufügen einen Eintrag. Füllen Sie Titel mit einer verständlichen Frage oder Abschnittsüberschrift und Nachricht mit dem zusammengehörenden Inhalt. Weitere Bilder oder Tabellen innerhalb einer Antwort sollten nur verwendet werden, wenn sie dort tatsächlich benötigt werden. Längere eigenständige Inhalte sind auf einer verlinkten Unterseite meist leichter zu pflegen.
Abbildung 2: Das Core-Akkordeon verwaltet seine Einträge gemeinsam in einem Block. Der Verschiebegriff sortiert die Einträge innerhalb dieses Blocks.
Im Reiter Einstellungen wählen Sie Ausgangszustand: Erstes Element geöffnet, Alle Elemente geschlossen oder Alle Elemente geöffnet. Unter Format der Elementüberschrift bestimmen Sie die Überschriftenebene passend zur umgebenden Gliederung. Die vorhandene Seitenüberschrift ist gewöhnlich bereits H1; wählen Sie für zusätzliche Abschnitte nicht nochmals H1.
Abbildung 3: „Immer offen“ und „Ausgangszustand“ steuern unterschiedliche Eigenschaften. Die Optionen stehen im Reiter Einstellungen.
Immer offen bedeutet hier: Ein bereits geöffneter Eintrag bleibt offen, wenn ein anderer geöffnet wird. Die Option zwingt nicht alle Antworten dauerhaft in einen nicht schließbaren Zustand. Bündig betrifft die randlose Darstellung, nicht die redaktionelle Reihenfolge. Kontrollieren Sie die Wirkung nach Hinzufügen beziehungsweise Speichern und der Veröffentlichung in der Besucherausgabe. Das Theme muss das notwendige Verhalten unterstützen; eine vollständig lesbare Bearbeitungsansicht belegt noch keine funktionierende öffentliche Interaktion.
Zusätzliches Akkordeon bearbeiten
Der Paketblock unter Andere → Akkordeon besitzt ein anderes Formular. Wählen Sie zunächst die gemeinsame Überschriftenebene. Öffnen Sie einen Eintrag und bearbeiten Sie dessen Titel und Antwort. Die Antwort verwendet den normalen Texteditor; Quellcode ist für die übliche Pflege nicht nötig. Anfangs geöffnet wird pro Eintrag festgelegt.
Abbildung 4: Das zusätzliche Akkordeon bietet Pfeilschaltflächen für die Reihenfolge und einen eigenen Anfangszustand je Antwort.
Nutzen Sie Eintrag hinzufügen für weitere Antworten und Nach oben verschieben beziehungsweise Nach unten verschieben für die Reihenfolge. Entfernen betrifft den jeweiligen Eintrag. Beim Bearbeiten bestehender Inhalte öffnen Sie den vorhandenen Block, statt ihn durch den gleichnamigen Core-Block zu ersetzen. Die beiden Varianten haben unterschiedliche Daten und werden nicht durch eine bloße Auswahl eines anderen Templates ineinander umgewandelt.
Die öffentliche Ausgabe verwendet aufklappbare Abschnitte des Browsers. Mehrere Antworten können gleichzeitig geöffnet bleiben. Prüfen Sie auch hier Fokus, Überschriften und Inhalt nach der Veröffentlichung. Eine funktionierende Klickbedienung allein genügt nicht; die kurzen Prüfungen unten gehören dazu.
Tabs mit normalen Inhaltsblöcken aufbauen
Tabs – Abschnittsmarkierung enthält nicht den gesamten Text einer Registerkarte. Der Block markiert ihren Anfang oder das Ende einer Gruppe. Texte, Bilder und gegebenenfalls ein vorhandener Container bleiben eigene native Blöcke dazwischen. Diese Funktion benötigt einen dafür eingerichteten Theme-Bereich. Im Deutschland-Theme wird sie unter anderem im Hauptinhalt der Vorlage full verarbeitet; sie ist kein universeller Core-Tab-Block für jeden Bereich jedes Themes.
Abbildung 5: Die Markierung benennt eine Registerkarte. Ihre eigentlichen Texte und Bilder werden darunter als normale Blöcke eingefügt.
Für zwei Registerkarten legen Sie im selben vorgesehenen Bereich folgende Reihenfolge an:
- Tabs – Abschnittsmarkierung mit Markierung → Tab beginnen und Tab-Titel → Redaktion.
- Die normalen Text- und Bildblöcke für „Redaktion“.
- Eine weitere Markierung mit Tab beginnen und Tab-Titel → Entwicklung.
- Die normalen Inhaltsblöcke für „Entwicklung“.
- Eine abschließende Markierung mit Tab-Gruppe beenden.
- Erst danach Inhalte, die außerhalb der gesamten Tab-Gruppe stehen sollen.
Vergessen Sie die Abschlussmarkierung nicht: Sonst können nachfolgende Blöcke noch zum letzten Tab gehören. Verschieben Sie die Markierungen und die zugehörigen Inhalte bewusst zusammen. Verschachtelte Tab-Gruppen sind für dieses Modell nicht vorgesehen. Im Bearbeitungsmodus bleiben die Markierungen und Inhalte sichtbar, damit Sie jeden Block erreichen können.
Optionaler Ankername kann beispielsweise redaktion lauten. Verwenden Sie einen eindeutigen Namen ohne Leerzeichen; erlaubt sind Buchstaben, Ziffern, Unterstriche und Bindestriche. Prüfen Sie einen direkten Aufruf mit diesem Fragment in der veröffentlichten Seite. Automatisch erzeugte Panel-IDs sollten Sie nicht als dauerhaftes redaktionelles Linkziel abschreiben. Das Feld Überschriftenformat ohne JavaScript betrifft die Ausweichdarstellung der einzelnen Markierung; die vollständige Darstellung hängt zusätzlich vom zuständigen Theme-Bereich ab.
Mit Maus, Tastatur und schmalem Bildschirm prüfen
Prüfen Sie die veröffentlichte Seite als Gast. Durchlaufen Sie die Schalter mit Tab und öffnen beziehungsweise schließen Sie Antworten mit der Tastatur. Der Fokus muss erkennbar bleiben und der geöffnete Inhalt erreichbar sein. Bei den Tabs des Pakets wechseln Pfeil links/rechts zwischen den Registerkarten; Pos1 und Ende wählen die erste beziehungsweise letzte. Prüfen Sie anschließend auch die Links und Formulare innerhalb des sichtbaren Panels.
Öffnen Sie die Seite zusätzlich auf einem schmalen Bildschirm. Kontrollieren Sie lange Fragen, längere Tab-Titel und vergrößerte Schrift. Inhalte dürfen nicht ausschließlich beim Hover auftauchen. Prüfen Sie, ob ein Sprunglink die passende Antwort sichtbar erreicht und ob eine feste Kopfzeile die Überschrift verdeckt. Konkrete Grundregeln finden Sie in Barrierefreiheit im Redaktionsalltag.
Speichern Sie bei einer größeren Überarbeitung zunächst einen nachvollziehbaren Arbeitsstand und veröffentlichen Sie erst nach der Kontrolle. Wenn eine bestehende Antwort versehentlich entfernt wurde, hilft bei normalen Seiteninhalten die Versionsprüfung. Bei einem gemeinsam verwendeten Block beachten Sie zusätzlich Stapel und globale Bereiche.
Weiterlesen
- Blöcke hinzufügen und anordnen
- Barrierefreiheit im Redaktionsalltag
- Zusätzliche Blöcke von ConcreteCMS Deutschland verwenden
Quelle: Concrete CMS Dokumentation (EN) · Stand: ConcreteCMS 9.5.7