> 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

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="/files/HUwaM4F1aQsS9moUjwNN" alt=""><figcaption></figcaption></figure>

### Allgemeine - Einstellungen

<figure><img src="/files/F0WVNsUTNvapcPjnWhHY" 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="/pages/Q0EbnJqtuAaJuN9BHAE0">/pages/Q0EbnJqtuAaJuN9BHAE0</a></td></tr><tr><td>Timer (2)</td><td><a data-mention href="/pages/wI9KSzTd7bn1rb81rxqT">/pages/wI9KSzTd7bn1rb81rxqT</a></td></tr></tbody></table>

### Erweiterte - Einstellungen

<figure><img src="/files/hIGfvzYbyXctLnRKSq7X" 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="/pages/IDCzxbLczQ60ESEzaHLK">/pages/IDCzxbLczQ60ESEzaHLK</a></td></tr></tbody></table>

### Layout - Einstellungen

<figure><img src="/files/qq5C5VtUGQPyebcHWRtf" 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 %}
