> ## Documentation Index
> Fetch the complete documentation index at: https://docs.dreizack-medien.de/llms.txt
> Use this file to discover all available pages before exploring further.

# Sales Countdown

> Erzeuge Dringlichkeit durch Countdown-Angebote für begrenzte Zeit

## Allgemeine Beschreibung

Das "Sales Countdown" Portlet im OPC Conversion Booster bietet eine effektive Möglichkeit, zeitlich begrenzte Angebote hervorzuheben und Kunden zu schnellen Käufen zu motivieren. Mit seinen flexiblen Produktfiltern und anpassbaren Countdown-Optionen kannst du sicherstellen, dass deine Angebote optimal präsentiert werden.

## Einsatzmöglichkeiten

* **Flash Sales:** Erzeuge Aufregung und Dringlichkeit durch Countdown-Angebote für begrenzte Zeit, um Kunden zu schnellen Käufen zu motivieren.
* **Saisonale Aktionen:** Nutze den Countdown, um saisonale Verkaufsaktionen wie Sommer- oder Weihnachtsangebote hervorzuheben und zu bewerben.

## Featureübersicht

<AccordionGroup>
  <Accordion title="Individueller Titel">
    Gib der Countdown-Box einen individuellen Titel, um den Fokus auf das Angebot oder die Aktion zu lenken.
  </Accordion>

  <Accordion title="Banderolen-Option">
    Zeige eine Banderole ("Sale" oder "%") an, um das Angebot visuell hervorzuheben und den Kunden auf den Rabatt hinzuweisen.
  </Accordion>

  <Accordion title="Feingranulare Produktfilter">
    Filtere Produkte genau nach Kategorie, Hersteller, Artikelbesonderheiten und Preisspanne, um maßgeschneiderte Angebote zu präsentieren.
  </Accordion>

  <Accordion title="Flexible Countdown-Steuerung">
    Definiere den Countdown entweder durch ein festes Enddatum oder das Enddatum des Sonderpreises des Artikels, das sich an JTL-Wawi orientiert.
  </Accordion>

  <Accordion title="Anpassbare Countdown-Optik">
    Passe die Textfarbe des Countdowns an und hebe den Sales Countdown durch Schatten hervor, um ihn ins Auge fallen zu lassen.
  </Accordion>

  <Accordion title="Slider-Optionen">
    Stelle ein, ob der Slider automatisch abgespielt werden soll, definiere die Abspielgeschwindigkeit, aktiviere das Pausieren bei Hover und wähle, ob Pfeile für die Navigation angezeigt werden sollen.
  </Accordion>
</AccordionGroup>

## Settings

### Allgemein

<div className="border border-[#DFE1E1] rounded-2xl overflow-hidden dark:border-transparent">
  <Frame>
    <img src="https://mintcdn.com/dzm/oK60cSnz44Qgl-do/images/sales-countdown-allgemein.png?fit=max&auto=format&n=oK60cSnz44Qgl-do&q=85&s=4bc5f12fadc2fb2852548f63f1d57edd" alt="Allgemein" width="1340" height="848" data-path="images/sales-countdown-allgemein.png" />
  </Frame>
</div>

<ParamField path="Titel" type="string">
  Vergebe einen Titel für den Sales-Countdown, der oberhalb angezeigt wird.
</ParamField>

<ParamField path="Inhalt der Banderole" type="select">
  Wähle eine Banderole die oben links im Sale-Countdown angezeigt werden soll.

  **Optionen:**

  * Sale
  * %
  * Nicht anzeigen
</ParamField>

<br />

### Produktauswahl

<div className="border border-[#DFE1E1] rounded-2xl overflow-hidden dark:border-transparent">
  <Frame>
    <img src="https://mintcdn.com/dzm/oK60cSnz44Qgl-do/images/sales-countdown-produktauswahl.png?fit=max&auto=format&n=oK60cSnz44Qgl-do&q=85&s=c83fbf93594b4986fd46b786616e8171" alt="Produktauswahl" width="2677" height="4217" data-path="images/sales-countdown-produktauswahl.png" />
  </Frame>
</div>

<ParamField path="Wieviele Produkte sollen nacheinander angezeigt werden?" type="number">
  Lege hier die Anzahl der Produkte fest, die im Sale Countdown nacheinander angezeigt werden. Bei einem Produkt wird kein Slider erzeugt und es wird nur das eine Produkt permanent angezeigt.
</ParamField>

<ParamField path="Quelle des Produkts" type="select">
  Wähle hier aus, wie du deine Produkte hinzufügen möchtest.

  **Optionen:**

  * **Produkt(e) filtern:** Nutze die Filter, um passende Produkte zu finden
  * **Nach Artikelnummer oder -name:** Suche explizit nach bestimmten Artikeln
</ParamField>

<br />

### Zeitraum

<div className="border border-[#DFE1E1] rounded-2xl overflow-hidden dark:border-transparent">
  <Frame>
    <img src="https://mintcdn.com/dzm/oK60cSnz44Qgl-do/images/sales-countdown-zeitraum.png?fit=max&auto=format&n=oK60cSnz44Qgl-do&q=85&s=a82572ea581ab25c9e0adc68c5cf766b" alt="Zeitraum" width="1338" height="826" data-path="images/sales-countdown-zeitraum.png" />
  </Frame>
</div>

<ParamField path="Aktionsende" type="datetime">
  Wähle mit dem Kalender das entsprechende Enddatum und -uhrzeit aus.

  <Note>
    Diese Einstellung greift nur, wenn **Fixes Enddatum** ausgewählt wurde bzw. kein Ende des Sonderpreises in der Wawi hinterlegt wurde.
  </Note>
</ParamField>

<ParamField path="Enddatum der Aktion" type="select">
  Definiere hier woran sich das Enddatum der Aktion orientieren soll.

  **Optionen:**

  * **Fixes Enddatum:** Die Einstellung von "Aktionsende" bestimmt das Enddatum
  * **Enddatum des Sonderpreises:** Der Countdown orientiert sich an den Sonderpreisen, die für die entsprechenden Artikel in der Wawi hinterlegt sind
</ParamField>

<br />

### Darstellung

<div className="border border-[#DFE1E1] rounded-2xl overflow-hidden dark:border-transparent">
  <Frame>
    <img src="https://mintcdn.com/dzm/oK60cSnz44Qgl-do/images/sales-countdown-darstellung.png?fit=max&auto=format&n=oK60cSnz44Qgl-do&q=85&s=108acd7ef8e0d708d73279a7cfa92e43" alt="Darstellung" width="1332" height="1430" data-path="images/sales-countdown-darstellung.png" />
  </Frame>
</div>

<ParamField path="Textfarbe des Countdowns" type="color">
  Definiere hier die Textfarbe des Countdowns. Entweder durch Hinterlegen von Farbwerten oder mithilfe des ColorPickers.
</ParamField>

<ParamField path="Sales Countdown durch Schatten hervorheben" type="boolean">
  Wenn aktiviert, wird ein dezenter Schatten hinter der Box platziert, um diese besser hervorzuheben.
</ParamField>

<ParamField path="Automatisches abspielen aktivieren" type="boolean">
  Wenn aktiviert, wird der Slider automatisch abgespielt.

  <Note>
    Greift natürlich nur, wenn mehr als 1 Artikel in der Produktauswahl hinterlegt wurde.
  </Note>
</ParamField>

<ParamField path="Pausieren bei Hover" type="boolean">
  Wenn aktiviert, wird der Slider pausiert wenn sich eine Maus auf ihm befindet.
</ParamField>

<ParamField path="Abspielintervall in Millisekunden" type="number">
  Lege fest, wie schnell das nächste Produkt angezeigt werden soll (in ms).
</ParamField>

<ParamField path="Pfeile anzeigen?" type="boolean">
  Wenn aktiviert, werden links und rechts kleine Pfeile eingeblendet, um die Navigation durch den Slider zu vereinfachen.
</ParamField>

<div style={{height: '1px', backgroundColor: 'silver', margin: '24px 0'}} />