> ## 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.

# Bestands Alarm

> Low Stock Alert: Warnung bei niedrigem Lagerbestand zur Steigerung der Dringlichkeit

## Allgemeine Beschreibung

Auf der Produktdetailseite sorgt das **Bestands Alarm**-Widget dafür, dass Besucher darüber informiert werden, dass nur noch eine geringe Anzahl des Produktes verfügbar ist.

Dieses clevere Tool ist darauf ausgelegt, bei Kunden ein Gefühl der Dringlichkeit zu wecken und sie zu einer schnellen Kaufentscheidung zu motivieren. Indem es in Echtzeit die knappe Verfügbarkeit des Produkts hervorhebt, spielt es effektiv auf die Furcht der Käufer an, etwas zu verpassen. So wird subtil suggeriert: „Handel jetzt, bevor es zu spät ist!".

## Featureübersicht

<AccordionGroup>
  <Accordion title="Widget auf allen Produktseiten">
    Das Widget wird automatisch auf all Deinen Produktseiten ausgespielt.
  </Accordion>

  <Accordion title="Definierbare Lagerbestandsgrenze">
    Entscheide selbst ab welchem Lagerbestand das Widget angezeigt werden soll.
  </Accordion>

  <Accordion title="Auch als Portlet verfügbar">
    Möchtest Du es an mehreren Stellen auf der Produktseite platzieren, kannst Du das Widget ganz einfach per OnPage-Composer an der gewünschten Stelle platzieren.
  </Accordion>

  <Accordion title="Anpassbarer Text">
    Passe den angezeigten Text ganz einfach per Sprachvariable an.
  </Accordion>

  <Accordion title="Anpassbare Styles">
    Passe das Aussehen des Widgets nach Belieben an.
  </Accordion>

  <Accordion title="Verschiedene Einfügeoptionen">
    Entscheide selbst per CSS-Selektor an welcher Stelle das Widget auf der Produktdetailseite ausgespielt werden soll.
  </Accordion>
</AccordionGroup>

## Settings

### Funktionen

<div className="border border-[#DFE1E1] rounded-2xl overflow-hidden dark:border-transparent">
  <Frame>
    <img src="https://mintcdn.com/dzm/Um9uiS1WhbXUc7rH/images/bestandtsalarm-funktionen.jpg?fit=max&auto=format&n=Um9uiS1WhbXUc7rH&q=85&s=5757320f6de17e64d52031d4c18211ba" alt="Funktionen" width="2150" height="340" data-path="images/bestandtsalarm-funktionen.jpg" />
  </Frame>
</div>

<ParamField path="Widget aktiv" type="boolean">
  Entscheide, ob das Widget aktiv und automatisch an der per CSS-Selektor gewählten Stelle platziert werden soll.
</ParamField>

<ParamField path="Demo Modus" type="boolean">
  Aktiviere den Demo Modus, um das Widget zu testen. Der reale Lagerbestand wird dann ignoriert und auf der Produktdetailseite wird die definierte Lagerbestandsgrenze angezeigt.

  <Warning>
    Diese Funktion ist nicht für den produktiven Shop geeignet.
  </Warning>
</ParamField>

<ParamField path="Widget anzeigen ab x Lagerbestand" type="number">
  Definiere hier die untere Grenze des Lagerbestands, die definiert ab wann das Widget ausgespielt werden soll.
</ParamField>

<br />

### Sichtbarkeit

<div className="border border-[#DFE1E1] rounded-2xl overflow-hidden dark:border-transparent">
  <Frame>
    <img src="https://mintcdn.com/dzm/Um9uiS1WhbXUc7rH/images/bestandtsalarm-sichtbarkeit.jpg?fit=max&auto=format&n=Um9uiS1WhbXUc7rH&q=85&s=51a6cd5a55ed12ff6a5932adc19af7e8" alt="Sichtbarkeit" width="2158" height="206" data-path="images/bestandtsalarm-sichtbarkeit.jpg" />
  </Frame>
</div>

Du kannst das Widget gezielt bei Produkten ausblenden, indem du dem Artikel das Funktionsattribut `dzm_hide_low_stock_alert` vom Typ Checkbox anhängst und die Checkbox aktivierst.

**Nur bei Attribut sichtbar schalten:** Aktiviere diese Option, damit das Widget nur dann angezeigt wird, wenn das entsprechende Attribut am Artikel gesetzt ist.

<br />

### Vorschau

Hier siehst du dein Widget in der Vorschau.

<div className="border border-[#DFE1E1] rounded-2xl overflow-hidden dark:border-transparent">
  <Frame>
    <img src="https://mintcdn.com/dzm/Um9uiS1WhbXUc7rH/images/bestandtsalarm-vorschau.jpg?fit=max&auto=format&n=Um9uiS1WhbXUc7rH&q=85&s=b501970b00153ab520d0f4c5dc05e2f0" alt="Vorschau" width="2162" height="234" data-path="images/bestandtsalarm-vorschau.jpg" />
  </Frame>
</div>

<br />

### Styles

<div className="border border-[#DFE1E1] rounded-2xl overflow-hidden dark:border-transparent">
  <Frame>
    <img src="https://mintcdn.com/dzm/Um9uiS1WhbXUc7rH/images/bestandtsalarm-styles.jpg?fit=max&auto=format&n=Um9uiS1WhbXUc7rH&q=85&s=8bc75873f9f5aab41df4a3a4b2747a97" alt="Styles" width="2158" height="368" data-path="images/bestandtsalarm-styles.jpg" />
  </Frame>
</div>

<ParamField path="Icon" type="icon">
  Wähle das angezeigte Icon für das Widget - du kannst aus einer umfangreichen Bibliothek frei wählen.
</ParamField>

<ParamField path="Stil" type="select">
  Wähle aus verschiedenen Darstellungsoptionen, wie das Hauptwidget angezeigt werden soll.
</ParamField>

<ParamField path="Farbe Icon" type="color">
  Wähle hier die Farbe, die für das Icon des Widgets verwendet werden soll.
</ParamField>

<br />

### Einfügeoptionen

<div className="border border-[#DFE1E1] rounded-2xl overflow-hidden dark:border-transparent">
  <Frame>
    <img src="https://mintcdn.com/dzm/Um9uiS1WhbXUc7rH/images/bestandtsalarm-einfuegeoptionen.jpg?fit=max&auto=format&n=Um9uiS1WhbXUc7rH&q=85&s=b8ecd847fe95f6d369cb0c009be8db80" alt="Einfügeoptionen" width="2156" height="282" data-path="images/bestandtsalarm-einfuegeoptionen.jpg" />
  </Frame>
</div>

<ParamField path="Einfügemethode" type="select">
  Wähle aus verschiedenen Einfügemethoden, wie das Widget an den CSS-Selektor eingefügt werden soll.

  **Optionen:**

  * **Anhängen:** Hängt das Widget an den restlichen Inhalt an
  * **Voranstellen:** Stellt das Widget dem restlichen Inhalt voran
  * **Vor dem Container:** Fügt das Widget vor dem Container ein
  * **Nach dem Container:** Hängt das Widget an den Container an
  * **Ersetzen:** Ersetzt den restlichen Inhalt des Containers mit dem Widget
</ParamField>

<ParamField path="Selektor" type="string" default="#dzm_low_stock_alert_container">
  Wähle hier einen oder mehrere CSS Selektoren in die das Widget geladen wird. Du kannst mehrere Selektoren mit Komma (,) trennen. Der Standard Selektor fügt das Widget über der Lagerbestandsanzeige ein. Wenn du das Feld komplett leer lässt, wird das Widget nicht injiziert und du kannst es per Portlet einbinden wo du möchtest.
</ParamField>

## Widget als Portlet nutzen

Um das Widget als Portlet zu nutzen, muss das Widget in den Einstellungen aktiviert sein. Um zu vermeiden, dass es auf allen Produktseiten erscheint, muss der CSS-Selektor leer gelassen werden. Dadurch kann das Widget flexibel im OnPage-Composer (OPC) verwendet werden. Du kannst es per Drag & Drop an den gewünschten Mountpoints auf den jeweiligen Produktseiten platzieren.

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