Produkt Box

Übersicht

Produkt Boxen kommen in Shopware an unterschiedlichen Stellen zum Einsatz. Beispiele sind hierfür das Listing auf Kategorieseiten oder ein Produkt Slider im Cross Selling auf der Produkt Detailseite. Sie bilden das zentrale Element einer Produktverlinkung und können über die Erlebniswelten dynamisch an unterschiedlichen Stellen in deinem Shop eingebunden werden. Hierbei kannst du vereinzelte Einstellungen direkt in den Element-Einstellungen in einer Erlebniswelt vornehmen. Möchtest du jedoch das Aussehen deiner Produkt Boxen global anpassen, bilden die Konfigurationsmöglichkeiten in diesem Abschnitt die Grundlage dafür.

Produkt Box unseres Kunden https://wisy-water.com/

Grundeinstellungen

Rand

Rahmen Ein Rahmen umschließt die Produkt Box. Die Farbe des Rahmens kannst du im Abschnitt Farben konfigurieren.

Schatten Die Produkt Box hebt sich mit einem Schatten ab. Hierbei wird die globale Schattenkonfiguration angewendet.

Keiner Es bildet sich kein Rand um die Produkt Box.

Hover Effekt

Slide Up Die Produkt Box bewegt sich ein Stück nach oben, sobald man mit dem Mauszeiger über sie fährt. Wenn der Mauszeiger die Produkt Box wieder verlässt, senkt sich die Produkt Box wieder herab.

Keiner Es wird kein Hover Effekt angewendet.

Hersteller Badge anzeigen

Ja Der Herstellername wird am linken oberen Rand der Produkt Box ausgegeben.

Nein Der Herstellername wird nicht angezeigt.

Rabatt Badge anzeigen

Ja Der Rabatt wird am linken oberen Rand der Produkt Box ausgegeben, sofern ein Streichpreis auf dem Produkt gepflegt ist.

Nein Der Rabatt wird nicht angezeigt.

Ausrichtung

Zentriert Der Text wird innerhalb der Produkt Box zentriert.

Linksbündig Der Text wird innerhalb der Produkt Box linksbündig ausgerichtet.

Platzhalter verwenden

Ja Platzhalter sind maßgeblich dafür verantwortlich, ob sich die Inhalte verschiedener Produkt Boxen wie Titel oder Preise auf einer gleichen horizontalen Linie befinden. Enthält bspw. ein Produkt Bewertungen ein anderes hingegen nicht, muss ein Platzhalter geschaffen werden, sodass die Preise beider Produkt Boxen weiterhin auf der selben Höhe bleiben. Gerade wenn ein Rand konfiguriert wurde, kann es sonst schnell vorkommen, dass Produkt Boxen sichtlich nicht mehr alle dieselbe Höhe haben. Dies führt im Zweifelsfall zu einem uneinheitlichen Bild in Listings oder auch Produkt Slidern.

Nein Es werden keine Platzhalter angewendet.

Titellänge

Eine Zeile Der Produkttitel wird auf eine Zeile begrenzt. Sollte er nicht komplett in die Zeile passen, wird er mit einem "…" abgeschnitten.

Zwei Zeilen Der Titel streckt sich immer auf zwei Zeilen. Sollte ein Titel kürzer als zwei Zeilen sein, wird der übrige Platz mit einem weißen Platzhalter aufgefüllt. Sollte der Titel länger sein, wird er ebenfalls mit einem "…" abgeschnitten.

Drei Zeilen Der Titel streckt sich immer auf drei Zeilen. Sollte ein Titel kürzer als drei Zeilen sein, wird der übrige Platz mit einem weißen Platzhalter aufgefüllt. Sollte der Titel länger sein, wird er ebenfalls mit einem "…" abgeschnitten.

Automatisch Der Titel wird immer komplett ausgeschrieben. Hierbei kann nicht mehr garantiert werden, dass sich die Inhalte unterschiedlicher Produkt Boxen weiterhin auf derselben Höhe befinden. Gerade bei einem gewählten Rand, kann dies zu Inkonsistenz zwischen den Produkt Boxen führen.

Bewertungen

Standard Die Produktbewertungen werden wie im Shopware Standard unterhalb des Titels integriert.

Ausblenden Die Bewertungen werden innerhalb der Produkt Box deaktiviert.

Produktnummer

Unterhalb des Produkttitels Die Produktnummer wird unterhalb des Titels integriert.

Ausblenden Die Produktnummer wird nicht in die Produkt Box eingebunden.

Produktnummer Länge

Eine Zeile Die Produktnummer wird auf eine Zeile begrenzt. Sollte sie nicht komplett in die Zeile passen, wird sie mit einem "…" abgeschnitten.

Zwei Zeilen Die Produktnummer streckt sich immer auf zwei Zeilen. Sollte eine Produktnummer kürzer als zwei Zeilen sein, wird der übrige Platz mit einem weißen Platzhalter aufgefüllt. Sollte die Produktnummer länger sein, wird sie ebenfalls mit einem "…" abgeschnitten.

Automatisch Die Produktnummer wird immer komplett ausgeschrieben. Hierbei kann nicht mehr garantiert werden, dass sich die Inhalte unterschiedlicher Produkt Boxen weiterhin auf derselben Höhe befinden. Gerade bei einem gewählten Rand, kann dies zu Inkonsistenz zwischen den Produkt Boxen führen.

Lieferzeit

Unterhalb des Produkttitels Die Lieferzeit wird unterhalb des Titels integriert.

Ausblenden Die Lieferzeit wird nicht in die Produkt Box eingebunden.

Lieferzeit Länge

Eine Zeile Die Lieferzeit wird auf eine Zeile begrenzt. Sollte sie nicht komplett in die Zeile passen, wird sie mit einem "…" abgeschnitten.

Zwei Zeilen Die Lieferzeit streckt sich immer auf zwei Zeilen. Sollte eine Lieferzeit kürzer als zwei Zeilen sein, wird der übrige Platz mit einem weißen Platzhalter aufgefüllt. Sollte die Lieferzeit länger sein, wird sie ebenfalls mit einem "…" abgeschnitten.

Automatisch Die Lieferzeit wird immer komplett ausgeschrieben. Hierbei kann nicht mehr garantiert werden, dass sich die Inhalte unterschiedlicher Produkt Boxen weiterhin auf derselben Höhe befinden. Gerade bei einem gewählten Rand, kann dies zu Inkonsistenz zwischen den Produkt Boxen führen.

Eigenschaften

Standard Die Eigenschaften werden in die Produkt Box integriert.

Ausblenden Die Eigenschaften werden nicht in die Produkt Box eingebunden.

Beschreibung

Standard Die Beschreibung wird wie im Shopware Standard in die Produkt Box eingebunden.

Ausblenden Die Beschreibung wird nicht in die Produkt Box integriert.

Grundpreis

Standard Der Grundpreis wird wie im Shopware Standard in die Produkt Box eingebunden.

Ausblenden Der Grundpreis wird nicht in die Produkt Box integriert.

Warenkorb/Details Button

Hover Der Warenkorb/Details Button erscheint, wenn man mit dem Mauszeiger über das Produktbild fährt. Er verschwindet wieder, sobald der Mauszeiger das Bild wieder verlässt.

Standard Der Warenkorb/Details Button wird wie im Shopware Standard am Ende der Produkt Box statisch eingebunden.

Produktbild

Globaler Produktbild Hover

Ja Das zweite Bild der Produktgalerie wird als Hover Effekt verwendet. Erfahre mehr über das Produktbild Hover Feature des Themes.

Nein Es wird kein Produktbild Hover Effekt integriert.

Minimale Höhe (in px)

In den Erlebniswelten hast du für jedes Element, das Produkt Boxen enthält, die Möglichkeit den Anzeigemodus zu definieren. Diese Option hat hierbei lediglich Auswirkung auf den Anzeigemodus "Füllen" und legt letztendlich die Größe des Bildes innerhalb der Produkt Box fest.

Abgerundete Ecken (in px)

Definiere wie stark die Ecken deiner Artikelbilder abgerundet sein sollen. Diese Einstellung wirkt sich global auf alle Produktbilder aus.

Abstände

Oberer/unterer Innenabstand bei Rand (in px)

Lege den oberen und unteren Innenabstand der Produkt Box fest. Diese Einstellung wird lediglich bei einem gewählten Rand-Styling angewendet.

Linker/rechter Innenabstand bei Rand (in px)

Lege den linken und rechten Innenabstand der Produkt Box fest. Diese Einstellung wird lediglich bei einem gewählten Rand-Styling angewendet.

Oberer/unterer Innenabstand bei Rand für Smartphones (in px)

Lege den oberen und unteren Innenabstand der Produkt Box für Smartphones fest. Diese Einstellung wird lediglich bei einem gewählten Rand-Styling angewendet.

Linker/rechter Innenabstand bei Rand für Smartphones (in px)

Lege den linken und rechten Innenabstand der Produkt Box für Smartphones fest. Diese Einstellung wird lediglich bei einem gewählten Rand-Styling angewendet.

Unterer Abstand des Titels (in px)

Lege den unteren Abstand des Produkttitels fest.

Unterer Abstand der Produktnummer (in px)

Definiere den unteren Abstand der Produktnummer.

Unterer Abstand der Lieferzeit (in px)

Hinterlege den unteren Abstand der Lieferzeit.

Unterer Abstand des Preises (in px)

Lege den unteren Abstand des Preises fest.

Typografie

In diesem Abschnitt kannst du die Schriftgröße und Schriftstärke der einzelnen Elemente innerhalb der Produkt Box festlegen. Je nach Schriftart stehen dir für die Schriftstärke folgende Konfigurationsoptionen zur Verfügung:

100 = Thin 200 = Extra Light 300 = Light 400 = Normal 500 = Medium 600 = Semi Bold 700 = Bold 800 = Extra Bold 900 = Black

Farben

Produkt Box Hintergrund

Lege die Hintergrundfarbe für die Produkt Box fest.

Produkt Box Bild Hintergrund

Lege die Hintergrundfarbe für die Produkt Box Bilder fest.

Beachte, dass die Farbe lediglich angewendet wird, wenn du ein ausgeschnittenes Bildformat wie bspw. PNG verwendest.

Rabatt Badge Hintergrund

Lege die Hintergrundfarbe für das Rabatt Badge fest. Standardmäßig wird in diesem Feld die Farbe von fehlerhaften Status-Ausgaben über eine Variable verknüpft.

Topseller Badge Hintergrund

Lege die Hintergrundfarbe für das Topseller Badge fest. Standardmäßig wird in diesem Feld die Farbe von warnenden Status-Ausgaben über eine Variable verknüpft. Das Badge lässt sich über das Produkt Modul einblenden, indem du die Option "Produkt hervorheben" aktivierst.

Neu Badge Hintergrund

Lege die Hintergrundfarbe für das Neu Badge fest. Standardmäßig wird in diesem Feld die Farbe von erfolgreichen Status-Ausgaben über eine Variable verknüpft. Das Badge lässt sich über das Produkt Modul einblenden, indem du das "Erscheinungsdatum" pflegst. Alle Produkte, die älter als 30 Tage sind verlieren automatisch das Badge. Die Anzahl dieser Tage kannst du in den Einstellungen zum Produkt festlegen.

Rahmen

Voraussetzung hierfür ist die Option "Rahmen" im Feld Rand.

---

Definiere die Rahmenfarbe der Produkt Box. Standardmäßig wird hier die globale Rahmenfarbe über eine Variable eingebunden.

Titel

Hinterlege die Schriftfarbe des Titels. Standardmäßig wird hier die globle Textfarbe über eine Variable integriert.

Streichpreis

Hinterlege die Schriftfarbe des Streichpreises. Standardmäßig wird hier die Farbe für fehlerhafte Status-Ausgaben über eine Variable integriert.

Grundpreis

Hinterlege die Schriftfarbe des Grundpreises. Standardmäßig wird hier die Farbe für Preise über eine Variable integriert.