> For the complete documentation index, see [llms.txt](https://docs.rh-webdesign.com/cms-bundle/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.rh-webdesign.com/cms-bundle/elemente/call-to-action/countdown-banner.md).

# Countdown - Banner

Zeitlich begrenzter Inhalt in den Erlebniswelten

Das **Element** ist eine hervorragende Möglichkeit, Dringlichkeit zu erzeugen und zeitlich begrenzte Aktionen oder Events in deinem Shop hervorzuheben.

Ob es sich um ein Sonderangebot, eine bevorstehende Veranstaltung oder einen Produkt-Launch handelt – der Countdown zieht die Aufmerksamkeit der Besucher auf sich und motiviert sie, rechtzeitig zu handeln.

{% hint style="info" %}
**Was macht das Countdown-Banner-Element genau?**

Der Countdown-Banner zeigt einen **Timer** an, der in **Echtzeit herunterzählt** und die verbleibende Zeit bis zu einem bestimmten Ereignis oder Angebot anzeigt.
{% endhint %}

<figure><img src="https://3915424864-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FnbkIIyayUD6QJmp1xMoG%2Fuploads%2F6EVWe9zVVLSWq7yKNbqs%2FBildschirmfoto%202024-10-06%20um%2017.30.58.png?alt=media&amp;token=97cb40d9-0747-4532-8eca-4f5e430aa1f5" alt=""><figcaption></figcaption></figure>

### Allgemeine - Einstellungen

<figure><img src="https://3915424864-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FnbkIIyayUD6QJmp1xMoG%2Fuploads%2FoQwfjH9BDFih34NZh0sG%2FBildschirmfoto%202024-10-06%20um%2017.32.12.png?alt=media&amp;token=39ed7ba3-8765-49ff-b041-df3e7010a927" alt=""><figcaption></figcaption></figure>

<table><thead><tr><th width="265">Funktion</th><th>Beschreibung</th></tr></thead><tbody><tr><td>Verlinkung (1)</td><td><a data-mention href="/cms-bundle/elemente/konfigurationsbausteine/verlinkung.md">Verlinkung</a></td></tr><tr><td>Timer (2)</td><td><a data-mention href="/cms-bundle/elemente/konfigurationsbausteine/timer.md">Timer</a></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%2FgGHGji7XVFKGlKBR6B3f%2FBildschirmfoto%202024-10-06%20um%2017.39.47.png?alt=media&amp;token=f379ef2e-6080-4351-a60b-8053def3cb4e" alt=""><figcaption></figcaption></figure>

<table><thead><tr><th width="263">Funktion</th><th>Beschreibung</th></tr></thead><tbody><tr><td>Überschrift (1)</td><td>Hier kannst du die Überschrift für den Banner setzen</td></tr><tr><td>Untertitel (2)</td><td>Hier kannst du den Untertitel für den Banner setzen</td></tr><tr><td>Button - Einstellungen (3)</td><td><a data-mention href="/cms-bundle/elemente/konfigurationsbausteine/button.md">Button</a></td></tr></tbody></table>

### Layout - Einstellungen

<figure><img src="https://3915424864-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FnbkIIyayUD6QJmp1xMoG%2Fuploads%2FHghdmvUFO4oGY3UmLgL4%2FBildschirmfoto%202024-10-06%20um%2017.59.30.png?alt=media&amp;token=a408a345-18f8-4f8d-b65f-ea1db6b86905" alt=""><figcaption></figcaption></figure>

<table><thead><tr><th width="248">Funktion</th><th>Beschreibung</th></tr></thead><tbody><tr><td>Hintergrundbild (1)</td><td>Statt einer Farbe, kann hier auch ein Hintergrundbild gesetzt werden</td></tr><tr><td>Struktureinstellungen (2)</td><td>Die Breite und der Innenabstand kann hier für das gesamte Element definiert werden.</td></tr><tr><td>Farbeinstellungen (3)</td><td>Achte auf eine kontrastreiche Darstellung damit Inhalte gut lesbar sind</td></tr><tr><td>Ausrichtung (4)</td><td>Die vertikale- und horizontale Ausrichtung des Inhalts</td></tr></tbody></table>

### Mobile - Einstellungen

{% content-ref url="/pages/ZJ9dlvURdA2KvrRvb6W0" %}
[Schriftgröße](/cms-bundle/elemente/konfigurationsbausteine/schriftgrosse.md)
{% endcontent-ref %}

### SEO - Einstellungen

{% content-ref url="/pages/LHlzFdFr8hVLrftTJKPh" %}
[SEO](/cms-bundle/elemente/konfigurationsbausteine/seo.md)
{% endcontent-ref %}
