> For the complete documentation index, see [llms.txt](https://docs.themeware.design/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.themeware.design/additional-features/cms-extensions/cms-elements/hero-slider.md).

# Hero slider

{% hint style="info" %}
**Note**: This article is work in progress.
{% endhint %}

Die **ThemeWare® Hero slider elements** (slides) sind explizit für die Verwendung im CMS-Block "**Hero slider (...)**" (siehe [Hero slider](/additional-features/cms-extensions/cms-blocks/hero-slider.md)) vorgesehen. Die Elemente sind nicht für die Nutzung in anderen CMS-Blöcken ausgelegt und funktionieren nicht in anderen CMS-Blöcken.

## Available slider elements

* [Call-to-Action slide (Hero slider)](/additional-features/cms-extensions/cms-elements/hero-slider/call-to-action-hero-slider.md)
* [Text slide (Hero slider)](/additional-features/cms-extensions/cms-elements/hero-slider/text-hero-slider.md)
* [Image slide (Hero slider)](/additional-features/cms-extensions/cms-elements/hero-slider/image-slide-hero-slider.md)

***

## Add a "Hero slider"

Füge den CMS-Block des gewünschten Hero-Slider einfach per Drag’n’Drop deiner Erlebniswelt hinzu. Mehr Informationen dazu findest du in der folgenden Anleitung: [Hero slider](/additional-features/cms-extensions/cms-blocks/hero-slider.md)

> **Note**: You can find the "Hero slider" blocks in the "ThemeWare® General" section \[Pro]

***

## Replace a slider element

Der ThemeWare® Hero-Slider ist mit [Text slide (Hero slider)](/additional-features/cms-extensions/cms-elements/hero-slider/text-hero-slider.md) Elementen befüllt. Du kannst diese gegen [Call-to-Action slide (Hero slider)](/additional-features/cms-extensions/cms-elements/hero-slider/call-to-action-hero-slider.md) austauschen:

1. Klicke auf den entsprechenden CMS-Block (1) um den Bearbeitungsmodus zu aktivieren
2. Navigiere mit der Pfeil-Navigation zum gewünschten Element (2)
3. Klicke auf das ![](https://3369454551-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FyzUEL0OiJhd4m6fQWdQe%2Fuploads%2FmJletu5KccxmhgyvuZUv%2Ficon-repeat.png?alt=media\&token=af944903-299f-43a7-a5cd-92e635d8669b) "Austauschen"-Icon (3) um das CMS-Element zu konfigurieren
4. Es öffnet sich das Pop-up "Element auswählen"
5. Wähle das gewünschte CMS-Element (z.B. "Call-to-Action-Slide (Hero-Slider)") aus (4)

Du hast nun das CMS-Element ausgetauscht.

<div><figure><img src="https://3369454551-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FyzUEL0OiJhd4m6fQWdQe%2Fuploads%2Fz4nX7zuWlgnf4JBZ4gJ5%2Fcms-hero-slider--replace-element.png?alt=media&amp;token=8283fd0f-48fc-4e93-a38e-616c8ab43ea6" alt=""><figcaption><p>ThemeWare® Hero-Slider: Element austauschen</p></figcaption></figure> <figure><img src="https://3369454551-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FyzUEL0OiJhd4m6fQWdQe%2Fuploads%2FOJeG8VTlLtcbjmiaVgFG%2Fcms-extensions--hero-slider-select-element.png?alt=media&amp;token=716d69a7-1916-42cb-8183-c25f5cd3d355" alt=""><figcaption></figcaption></figure></div>

***

## Demo

You can find some examples of use in our demo shops:

{% embed url="<https://demo.themeware.design/modern/en/Features/ThemeWare-CMS-elements/Hero-slider/>" %}
ThemeWare® Demoshop => Hero slider
{% endembed %}