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

# Produktansichten

> Zeigt Besuchern wie viele andere Besucher sich das Produkt in den letzten 24h angesehen haben

## Allgemeine Beschreibung

Das **Produktansichten**-Widget spielt auf der Artikeldetailseite ein Widget aus, welches dem Besucher anzeigt, wie viele andere Besucher sich das Produkt innerhalb der letzten 24 Stunden angesehen haben. Das Konzept dahinter ist eine Mischung aus Dringlichkeit und Social Trust.

## Einsatzmöglichkeiten

* **Kaufanreiz schaffen:** Nutze das Widget, um durch Social Proof (soziales Vertrauen) die Kaufentscheidung unentschlossener Kunden zu beschleunigen. Wenn andere Kunden sich den Artikel ansehen, wirkt er begehrter.
* **Verknappung suggerieren:** Besonders bei Artikeln mit geringem Bestand erzeugt die Anzeige hoher Besucherzahlen ein Gefühl der Dringlichkeit (FOMO – Fear of Missing Out), was die Conversion Rate steigern kann.

## Featureübersicht

<AccordionGroup>
  <Accordion title="Dringlichkeit & Trust">
    Zeigt automatisch die Seitenaufrufe der letzten 24 Stunden direkt am Artikel an.
  </Accordion>

  <Accordion title="Smarte Zählung">
    Du kannst gezielt einstellen, ob Mehrfachaufrufe desselben Nutzers ignoriert werden sollen, um realistische Zahlen zu gewährleisten.
  </Accordion>

  <Accordion title="Variations-Unterstützung">
    Die Aufrufe von Haupt- und Kindartikeln (Variationen) lassen sich bequem zusammenrechnen.
  </Accordion>

  <Accordion title="Optische Anpassung">
    Flexibel wählbare Icons und verschiedene Widget-Stile zur nahtlosen Integration in dein Shop-Design.
  </Accordion>

  <Accordion title="Flexible Platzierung">
    Einfache Positionierung im Shop über CSS-Selektoren und verschiedene Einfügemethoden.
  </Accordion>
</AccordionGroup>

## Settings

### Funktionen

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

<ParamField path="Widget aktiv" type="boolean">
  Aktiviere oder deaktiviere die automatische Einbindung ins Template. Manuell im OPC platzierte Portlets bleiben davon unberührt, die blendest du über die Sichtbarkeits-Einstellungen des jeweiligen Portlets aus.
</ParamField>

<ParamField path="Als Alternative zum Widget 'Beobachtet gerade' verwenden" type="boolean">
  Aktiviere diesen Schalter, wenn du die Anzeige der "letzten 24h" als Ersatz für eine Live-Beobachter-Funktion nutzen möchtest.
</ParamField>

<ParamField path="Parent- und Childproducts kombinieren" type="boolean">
  Wenn aktiv, werden die Seitenaufrufe eines Hauptartikels (Parent) und all seiner zugehörigen Varianten (Child) addiert und als Gesamtwert angezeigt.
</ParamField>

<ParamField path="Keine Mehrfachaufrufe zählen" type="boolean">
  Wenn aktiviert, wird verhindert, dass ein einzelner Besucher, der die Seite mehrmals neu lädt, die Zählung künstlich in die Höhe treibt.
</ParamField>

<ParamField path="Demomodus" type="boolean">
  Schalte diesen Modus ein, um die Anzeige des Widgets erst einmal sicher im Hintergrund testen zu können.

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

<br />

### Sichtbarkeit

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

Du kannst das Widget gezielt bei Produkten ausblenden, indem du dem Artikel das Funktionsattribut `dzm_hide_latest_views` vom Typ Checkbox anhängst und die Checkbox aktivierst. Das Attribut wird je Artikel gepflegt, auch bei Variationskombinationen, und vererbt sich nicht auf Kindartikel.

<ParamField path="Nur bei Attribut sichtbar schalten" type="boolean">
  Alternativ kannst du die Wirkung umkehren und das Widget nur gezielt bei Artikeln anzeigen lassen, die das Funktionsattribut `dzm_show_latest_views` vom Typ Checkbox mit aktiver Checkbox angehängt haben.
</ParamField>

<br />

### Vorschau

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

Hier siehst du das Widget in der Vorschau. Dir wird direkt angezeigt, wie das Icon und der Text auf der Seite zusammenwirken.

<br />

### Styles

<div className="border border-[#DFE1E1] rounded-2xl overflow-hidden dark:border-transparent">
  <Frame>
    <img src="https://mintcdn.com/dzm/VEjx3IJjMCHHFcLn/images/produktansichten-styles.jpg?fit=max&auto=format&n=VEjx3IJjMCHHFcLn&q=85&s=dac6e341cee8298a827d5b31089117a2" alt="Styles" width="2062" height="420" data-path="images/produktansichten-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 Widget" 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 Widget" 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/VEjx3IJjMCHHFcLn/images/produktansichten-einfuegeoptionen.jpg?fit=max&auto=format&n=VEjx3IJjMCHHFcLn&q=85&s=a648f185d44024fce5661570fd29bda9" alt="Einfügeoptionen" width="2072" height="318" data-path="images/produktansichten-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_latest_views_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

Ein per Drag & Drop im OnPage-Composer (OPC) platziertes Portlet ist durch seine Platzierung aktiv – unabhängig vom Schalter "Widget aktiv" in den Einstellungen. Dieser Schalter steuert ausschließlich die automatische Einblendung über den CSS-Selektor. Lässt du den CSS-Selektor leer, erscheint das Widget nicht automatisch auf allen Produktseiten, und du kannst es stattdessen flexibel per Drag & Drop an den gewünschten Mountpoints auf den jeweiligen Produktseiten platzieren.

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


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.