# CMS-Sektion

Jedes [CMS-Layout](/wissensdatenbank/grundwissen/erlebniswelten/cms-layout.md) besteht aus einer oder mehreren CMS-Sektionen. Dadurch lassen sich viele unterschiedliche Designs mit fullwidth und/oder boxed Sektionen umsetzen.

Es gibt derzeit zwei Arten von CMS-Sektionen: "Sidebar" und "Volle Breite". Also einer Sektion mit Sidebar und einer Sektion ohne Sidebar.

<figure><img src="/files/22IcYL3vkGGiJqiWN54S" alt="" width="289"><figcaption><p>Sektion-Typ (Größenmodus)</p></figcaption></figure>

Eine CMS-Sektion wird mit einem oder mehreren CMS-Blöcken befüllt. Mehr dazu erfährst du im folgenden Artikel.

<figure><img src="/files/hiH9mIxX0YHq0OuVHVOr" alt=""><figcaption><p>CMS-Sektion</p></figcaption></figure>

***

## CMS-Sektion hinzufügen

Ein neues Layout enthält automatisch eine CMS-Sektion. Um eine weitere Sektion vor einer bestehenden Sektion hinzuzufügen, klicke auf das ![](/files/m7zDX53DIkYz9G5VSDuN) "Plus"-Icon (1) über der Sektion. Um eine Sektion nach einer bestehenden Sektion hinzuzufügen, klicke auf das "Plus"-Icon (2) unter der Sektion.

<figure><img src="/files/MEjwpJ9HSq7XyaECliue" alt=""><figcaption><p>CMS-Sektion hinzufügen</p></figcaption></figure>

Nun kannst du zwischen den beiden verfügbaren Arten von CMS-Sektionen ("Sidebar" und "Volle Breite") auswählen.

<figure><img src="/files/akah1M8jogG0PnPDQo3T" alt=""><figcaption><p>CMS-Sektionen</p></figcaption></figure>

***

## Sektion-Einstellungen

Die Einstellungen für eine CMS-Sektion erreichst du über das ![](/files/5EEruj7yPbpHruYWArDI) "Layout"-Icon (1) am linken Rand der entsprechenden Sektion. Ein Klick darauf öffnet die Sidebar (2) in welcher du die Sektions-Einstellungen findest. Hier kannst du beispielsweise den Namen und den Größenmodus der Sektion ändern.

<figure><img src="/files/XnhXf0BMRUgml1TLJoho" alt=""><figcaption><p>Sektion-Einstellungen</p></figcaption></figure>

### Einstellungen

Du kannst jeder Sektion einen **Namen** geben und **CSS-Klassen** hinzufügen. Du kannst den **Größenmodus** jeder Sektion auswählen sowie eine **Hintergrundfarbe** und ein **Hintergrundbild** zuweisen. Im Abschnitt "**Sichtbarkeit**" kannst du zudem festlegen auf welchem Gerät die Sektion angezeigt werden soll.

***

## Sektion im Editor und der Storefront

Die Darstellung von CMS-Sektionen im Erlebniswelt-Editor weist in Shopware 6 etwas von der tastsächlichen Darstellung in der Storefront ab. Eine CMS-Sektion geht stets über die volle Breite (außer du nutzt das ThemeWare® Boxed-Layout) der Erlebniswelt. Der eigentliche Inhalt einer Sektion kann dann über die "volle Breite" oder "boxed" ("Zentrierter Inhalt") dargestellt werden.

Nachfolgend siehst du einen Vergleich einer CMS-Sektion im Erlebniswelt-Editor und in der Storefront.

1. CMS-Sektion (1) \[Hintergrundfarbe: ![](/files/vZK98rTOBIWTEjsr6nb6) #ffd181]
2. CMS-Block (2) \[Hintergrundfarbe: ![](/files/XGq3OXjF7aMslQSc50do) #ff8d30]
3. CMS-Element (3)

<figure><img src="/files/N1uHr7H0WjdPxWncM6bf" alt=""><figcaption><p>Sektion im Erlebniswelt-Editor</p></figcaption></figure>

<figure><img src="/files/qz2tGB8sIvX2aQnnclYN" alt=""><figcaption><p>Sektion in der Storefront ("Zentrierter Inhalt")</p></figcaption></figure>

<figure><img src="/files/BZ7hehla585W8trT88i5" alt=""><figcaption><p>Sektion in der Storefront ("Volle Breite")</p></figcaption></figure>

***

#### Weiterführende Informationen

Mehr Informationen zum Thema "Erlebniswelten" in Shopware 6 findest du in der Shopware-Dokumentation:

{% embed url="<https://docs.shopware.com/de/shopware-6-de/Inhalte/Erlebniswelten>" %}
Shopware Dokumentation: Erlebniswelten
{% endembed %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://wiki.themeware.design/wissensdatenbank/grundwissen/erlebniswelten/cms-sektion.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.