# Akkordion

Mit diesem interaktiven Element können mehrere Informationsblöcke in **zusammenklappbaren Abschnitten** organisiert werden. Dies hilft, lange Textabschnitte übersichtlich zu gestalten und dem Benutzer die Möglichkeit zu geben, Inhalte bei Bedarf auszuklappen und wieder zu schließen.

{% hint style="info" %}
**Was ist das Akkordion - Element?**

Jeder Abschnitt des Akkordeons besteht aus einem **Titel** und einem versteckten Inhalt, der bei Klick auf den Titel sichtbar wird. So können Inhalte, wie FAQs, Produktdetails oder Anleitungen, organisiert werden, ohne dass die Seite überladen wirkt.
{% endhint %}

<figure><img src="https://3915424864-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FnbkIIyayUD6QJmp1xMoG%2Fuploads%2FrAuX86YQRXprOV7LYfy5%2FBildschirmfoto%202024-10-06%20um%2020.59.34.png?alt=media&#x26;token=e568a380-edfd-49e2-aede-4e064dbfa48f" alt=""><figcaption></figcaption></figure>

### Akkordion - Einstellungen

<figure><img src="https://3915424864-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FnbkIIyayUD6QJmp1xMoG%2Fuploads%2Fajroi7EY1MtSoI9KEyS9%2Fsnip_accordion.png?alt=media&#x26;token=559c8020-ce0c-48d7-86db-edf4641eee84" alt=""><figcaption></figcaption></figure>

<table><thead><tr><th width="266">Funktion</th><th>Beschreibung</th></tr></thead><tbody><tr><td>Sortierungsfunktion (1)</td><td>Duplizieren, verschieben und löschen der einzelnen Elemente</td></tr><tr><td>Titel des Eintrags (2)</td><td>Hier kannst du den Titel des Eintrags setzen</td></tr><tr><td>Inhalt des Eintrags (3)</td><td>Hier kannst du den Inhalt des Eintrags setzen</td></tr><tr><td>Neuer Eintrag (4)</td><td>Hier kannst du beliebig viele weitere Einträge hinzufügen</td></tr><tr><td>Eintrag geöffnet (4)</td><td>Hier kannst du einstellen, ob der Eintrag standardmäßig beim Laden der Seite geöffnet sein soll</td></tr></tbody></table>

### Erweiterte - Einstellungen

<figure><img src="https://3915424864-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FnbkIIyayUD6QJmp1xMoG%2Fuploads%2FzSonSh3mwytPhW9ggAxX%2FBildschirmfoto%202024-10-06%20um%2021.13.30.png?alt=media&#x26;token=f453f2f9-b303-4617-8559-2e8f089d9b05" alt=""><figcaption></figcaption></figure>

<table><thead><tr><th width="266">Funktion</th><th>Beschreibung</th></tr></thead><tbody><tr><td>Vertikale Ausrichtung (1)</td><td>Hier kannst du die vertikale Ausrichtung des gesamten Elements festlegen. Wenn das Akkordion neben einem optisch höheren Element dargestellt wird, kommt diese Funktion zur Geltung.</td></tr><tr><td>Anzeigemodus (2)</td><td><strong>Nur ein Eintrag ausklappbar</strong>, oder <strong>mehrere Einträge gleichzeitig ausklappbar</strong></td></tr><tr><td>Überschrift (3)</td><td>Setze eine Überschrift über das Akkordion</td></tr><tr><td>Beschreibung (4)</td><td>Setze eine Beschreibung über das Akkordion</td></tr></tbody></table>

### SEO - Einstellungen

{% content-ref url="../konfigurationsbausteine/seo" %}
[seo](https://docs.rh-webdesign.com/cms-bundle/elemente/konfigurationsbausteine/seo)
{% endcontent-ref %}