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

# Kauften auch

> Steigere deinen Umsatz durch automatische Cross-Selling-Empfehlungen

## Allgemeine Beschreibung

Das **Kauften auch**-Widget zeigt Besuchern auf der Produktdetailseite oder im Warenkorb automatisch Produkte an, die andere Kunden häufig gemeinsam mit dem aktuell betrachteten Artikel gekauft haben. Es nutzt das Kaufverhalten deiner Kunden, um relevante Produktempfehlungen auszuspielen und so Cross-Selling-Potenziale zu aktivieren.

Durch die gezielte Anzeige passender Ergänzungsprodukte erhöhst du den durchschnittlichen Warenkorbwert und bietest deinen Kunden gleichzeitig einen echten Mehrwert – ohne dass sie aktiv danach suchen müssen.

## Featureübersicht

<AccordionGroup>
  <Accordion title="Automatische Produktempfehlungen">
    Das Widget analysiert das Kaufverhalten deiner Kunden und spielt automatisch passende Produkte aus, die häufig zusammen gekauft wurden.
  </Accordion>

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

  <Accordion title="Anpassbarer Text">
    Passe den angezeigten Text ganz einfach per Sprachvariable an, um die Kunden optimal anzusprechen.
  </Accordion>

  <Accordion title="Anpassbare Styles">
    Gestalte das Aussehen des Widgets nach Belieben und passe es an dein Shop-Design an.
  </Accordion>

  <Accordion title="Verschiedene Einfügeoptionen">
    Entscheide selbst per CSS-Selektor, an welcher Stelle das Widget angezeigt 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/AeMmLTlNQ_uSJWZF/images/kauften-auch-funktionen.jpg?fit=max&auto=format&n=AeMmLTlNQ_uSJWZF&q=85&s=289cf6eed21a32f6bf3276718e2ff4eb" alt="Funktionen" width="2170" height="410" data-path="images/kauften-auch-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="Demomodus" type="boolean">
  Aktiviere den Demo Modus, um das Widget zu testen.

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

<ParamField path="Grenzwert" type="number">
  Lege hier den Mindestwert an gemeinsamen Käufen fest, ab dem ein Produkt als Empfehlung angezeigt wird.
</ParamField>

<ParamField path="Immer die Gesamtverkäufe anzeigen" type="boolean">
  Wenn aktiv, werden immer die gesamten Verkaufszahlen angezeigt, auch wenn der Grenzwert nicht erreicht wurde.
</ParamField>

<br />

### Vorschau

Hier siehst du eine Vorschau des Widgets mit deinen aktuellen Einstellungen.

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

<ParamField path="Text" type="string">
  Vorschau des angezeigten Textes im Widget. Den Text kannst du über Sprachvariablen anpassen.
</ParamField>

<br />

### Styles

<div className="border border-[#DFE1E1] rounded-2xl overflow-hidden dark:border-transparent">
  <Frame>
    <img src="https://mintcdn.com/dzm/AeMmLTlNQ_uSJWZF/images/kauften-auch-styles.jpg?fit=max&auto=format&n=AeMmLTlNQ_uSJWZF&q=85&s=20e4fc30713d12772349c351e6aef04a" alt="Styles" width="2162" height="372" data-path="images/kauften-auch-styles.jpg" />
  </Frame>
</div>

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

<ParamField path="Widgetstyle" type="select">
  Bestimme hier den visuellen Rahmen deines Widgets. Wähle aus verschiedenen Darstellungsoptionen, wie das Widget angezeigt werden soll.

  **Optionen:**

  * **Clean:** Aufgeräumte, minimalistische Darstellung ohne Rahmen
  * **Card:** Widget wird als Karte mit Hintergrund dargestellt
  * **Bordered:** Widget mit sichtbarem Rahmen
  * **Full:** Widget erstreckt sich über die volle Breite
  * **Alert Info:** Darstellung als informativer Hinweis
  * **Alert Warning:** Darstellung als Warnhinweis
  * **Alert Danger:** Darstellung als Gefahrenhinweis
  * **Alert Success:** Darstellung als Erfolgshinweis
</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/AeMmLTlNQ_uSJWZF/images/kauften-auch-einfuegeoptionen.jpg?fit=max&auto=format&n=AeMmLTlNQ_uSJWZF&q=85&s=07c0036b60c2ff1df095baac9f75cf8e" alt="Einfügeoptionen" width="2160" height="284" data-path="images/kauften-auch-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_product_purchases_container">
  Wähle hier einen oder mehrere CSS Selektoren in die das Widget geladen wird. Du kannst mehrere Selektoren mit Komma (,) trennen. 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. Dadurch kann das Widget flexibel im OnPage-Composer (OPC) verwendet werden. Du kannst es per Drag & Drop an den gewünschten Mountpoints an beliebigen Stellen in deinem Shop platzieren.

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