Accordion
Stellen Sie Textblöcke in Listenform dar.
Item-ID: 01-019
Beispielansicht Anleitung Verhalten Hinweise
Beispielansicht
Title: mit Subtitle as List
List element 1List element 2
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Title: Text mit Bild ohne Subtitle
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Title: mit Subtitle
Subtitle
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Anleitung
Akkordeon anlegen
- Klicken Sie auf den Button Inhalt, um eine Akkordeon-Element zu erstellen.
- Im Reiter Text klicken Sie auf Accordion.
Textblöcke anlegen
- Um einen Textblock mit Titel und ggf. Untertitel anzulegen, klicken Sie auf Neu anlegen.
- Für SEOs: Um die Schema.org-Auszeichnung für FAQs zu aktivieren, klicken Sie auf das Kästchen, sodass ein grüner Haken erscheint.
Texte erstellen
- Füllen Sie die Felder Title, ggf. Subtitle oder Subtitle as a List und den Description-Text aus.
- Fügen Sie ggf. ein Bild (Images: Datei hinzufügen) ein.
Elemente aufklappen
- Sie wählen die Option, wie viele Elemente angezeigt werden, indem Sie auf das Dropdown-Menü unter Aufgeklappte Elemente klicken.
- Zur Auswahl stehen beim Aufrufen einer Seite mit einem Accordion keine, die erste oder alle angelegten Antworten. Standardmäßig wird das erste Element angezeigt.
Elemente schließen
- Drücken Sie auf den Regler im Bereich Einzelner Erweiterungsmodus, um einzustellen, dass ein Element automatisch schließt, wenn ein anderes geklickt wird.
- In toujou voreingestellt ist die ausgeschaltete Option.
Weitere Texte anlegen
- Für weitere Texte klicken Sie wieder auf Neu anlegen.
- Sie können die Reihenfolge der Textblöcke mittels Pfeiltasten auf der rechten Seite nachträglich verändern.
- Speichern Sie Ihre Einstellungen.
Element Design für mehr Individualität
In diesem Element können Sie zudem das Erscheinungsbild ganz leicht mit dem Element Design mit einem Klick ändern. Mit der Auswahl von Standard Design, Primary Design, Secondary Design oder Umgekehrtes Design wechseln Sie Hintergrundfarbe des Elements und ggfs. die Hintergrundfarbe der Headline oder Pfeile bzw. des Textbereichs entsprechend der in den Theme-Settings definierten Farbe.
- Mit Klick auf das Element Design im Reiter Allgemein / General erhalten Sie im Dropdown-Menü die Wahl für eine individuelle Designfarbe.
- Wählen Sie aus den Optionen Standard, Primary, Secondary sowie Umgekehrt die gewünschte Option aus.
- Speichern Sie die Änderungen im Element, damit sie sichtbar werden.
Verhalten
Ein Accordion gibt den von Ihnen eingefügten Inhalt in Form eines »Akkordeon«-Elements wieder. Der Textblock des ersten Titels ist dabei stets sichtbar; alle weiteren (stets untereinander befindlichen) Titel und Textblöcke können mittels Klick auf den rechtsbündig platzierten Pfeil aufgeklappt und wieder geschlossen werden.
Besonderheiten: Text und ggf. Bild der Beschreibung sind stets so breit wie ihr Titel und verhalten sich je nach Ausgestaltung wie ein einfaches Textelement oder ein Text mit Bild im Text.
Responsive: Bilder werden bis zu einer bestimmten Bildschirmgröße in einem festen Verhältnis zum Text angezeigt. Ist nicht ausreichend Platz vorhanden, werden Bilder über dem Text auf voller Breite dargestellt.
Hinweise zur Verwendung von Akkordeon-Elementen für Texte:
Das Akkordeon-Element ist eine geläufige Darstellungsform für beispielsweise FAQ bzw. Häufig gestellte Fragen. Für SEOs besonders interessant: Mit dem Aktivieren des Schema.org-Markups unterstützen Sie mittels strukturierter Daten Ihre Suchmaschinenoptimierung für FAQ.
Generell eignet sich das Akkordeon für die Sammlung von verschiedenartigem Content, der einzeln für sich womöglich nicht die Erstellung einer eigenen Unterseite rechtfertigt; in Summe jedoch in reiner Textform zu lang sein könnte.
Ein Akkordeon bietet demnach die Möglichkeit, Themen platzsparend zu sammeln: in »kleinen« Textblöcken und mit einem Titel zur Kategorisierung. Wir raten Redakteur*innen jedoch dazu, das Akkordeon-Element sinnvoll einzusetzen, da ausgeblendete Inhalte nicht mittels Keyword-Recherche auffindbar sind. Dies gelingt nur, wenn Sie Ihre Titel und ggf. Untertitel gut verschlagworten. Wenn die Textblöcke einen Umfang von wenigen Zeilen überschreiten, sollten Sie über die Erstellung einer Content-Page für das Thema nachdenken, um wichtige Inhalte nicht zu verstecken.