> For the complete documentation index, see [llms.txt](https://wiki.themeware.design/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://wiki.themeware.design/wissensdatenbank/anleitungen/erlebniswelten/responsive-erlebniswelten.md).

# Responsive Erlebniswelten erstellen

Ab Shopware 6.4.19.0 kannst du die Sichtbarkeit von Sektionen und Blöcken ganz einfach im Erlebniswelt-Editor einstellen.

## 1. Erlebniswelt bearbeiten

1. Wechsel über die Hauptnavigation in die **Erlebniswelt-Verwaltung** ("Inhalte" => "Erlebniswelten")
2. Klicke auf die gewünschte Erlebniswelt um diese zu bearbeiten
3. Die Erlebniswelt öffnet sich nun im **Erlebniswelt-Editor**

## 2. Sektion bearbeiten

1. Klicke auf den Button ![](/files/86PlGfdcILQB7yG01dpj) oben links in der CMS-Sektion die du bearbeiten möchtest (1)
2. Die **Sektion-Einstellungen** öffnen sich rechts im Fenster (2)
3. Öffne den Abschnitt "**Sichtbarkeit**" (3)

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

## 2. Block bearbeiten

1. Klicke auf CMS-Block den du bearbeiten möchtest (1)
2. Die **Block-Einstellungen** öffnen sich rechts im Fenster (2)
3. Öffne den Abschnitt "**Sichtbarkeit**" (3)

<figure><img src="/files/ojEeGAqbunUTEV3f2buE" alt=""><figcaption><p>Block-Einstellungen</p></figcaption></figure>

## 3. Sichtbarkeit

Im Abschnitt "Sichtbarkeit" (3) kannst du die Sektion bzw. den Block nun für drei Viewports konfigurieren (4).

<table data-view="cards"><thead><tr><th></th><th></th><th data-hidden data-card-cover data-type="files"></th></tr></thead><tbody><tr><td><strong>Mobil</strong></td><td>0 px bis 767 px</td><td><a href="/files/PrufPe2jPQRbB2ru5RW5">/files/PrufPe2jPQRbB2ru5RW5</a></td></tr><tr><td><strong>Tablet</strong></td><td>768 px bis 991 px</td><td><a href="/files/ipNLzBY2BulPD0KVQeSI">/files/ipNLzBY2BulPD0KVQeSI</a></td></tr><tr><td><strong>Desktop</strong></td><td>ab 992 px</td><td><a href="/files/kzoNUqldqBOsUYJrB57m">/files/kzoNUqldqBOsUYJrB57m</a></td></tr></tbody></table>

Im Editor werden unsichtbare CMS-Sektionen bzw. CMS-Blöcke "eingeklappt".

* Mit einem Klick auf den Link "**Sektion einklappen**" bzw. "**Sektion ausklappen**" (5) kannst du eine unsichtbare CMS-Sektion ein-/ausklappen um sie zu bearbeiten.
* Mit einem Klick auf den Link "**Block einklappen**" bzw. "**Block ausklappen**" (5) kannst du einen unsichtbaren CMS-Block ein-/ausklappen um ihn zu bearbeiten.

<div><figure><img src="/files/hVflF5fSTBpGqkPQVJjq" alt=""><figcaption><p>Unsichtbare CMS-Sektion</p></figcaption></figure> <figure><img src="/files/HH1HCVLj79SijZkGD8o9" alt=""><figcaption><p>Unsichtbarer CMS-Block</p></figcaption></figure></div>

{% hint style="info" %}
**Hinweis**: Beachte das Shopware hierbei lediglich eine CSS-Klasse an der Sektion bzw. dem Block ergänzt. Das Element ist also lediglich unsichtbar, der HTML-Code ist nach wie vor in der Storefront vorhanden.
{% endhint %}

{% hint style="success" %}
**Tipp**: Bis Shopware mehr Viewports erlaubt, bieten dir die Bootstrap CSS-Klassen von ThemeWare® weitere Konfigurationsmöglichkeiten für die Sichtbarkeit von CMS-Sektionen und CMS-Blöcken: siehe [Responsive Erlebniswelten mit Bootstrap](/wissensdatenbank/anleitungen/erlebniswelten/responsive-erlebniswelten-mit-bootstrap.md)
{% endhint %}