Produkt-Widget: Design
3 Min. Lesezeit
Verwende die folgenden Optionen, um das perfekte Produkt-Widget zu entwerfen. (Die angezeigten Optionen können je nach gewähltem Layout variieren.)
Hintergründe & Ränder
- Hintergrund - Deckkraft & Farbe: Klicke auf das Farbfeld, um eine Hintergrundfarbe auszuwählen. Ziehe den Schieberegler, um die Deckkraft zu ändern.
- Randbreite (px) & Farbe: Klicke auf das Farbfeld, um eine Rahmenfarbe für das Produkt-Widget auszuwählen, und ziehe den Schieberegler, um die Rahmenbreite zu ändern.
- Trennlinienbreite (px) & Farbe: Klicke auf das Farbfeld, um die Farbe der Trennlinie auszuwählen, und ziehe den Schieberegler, um die Breite der Trenninie zu ändern.
- Trennlinienlänge (px): Ziehe den Schieberegler, um die Länge der Trennlinie zwischen Name und Preis zu ändern.
Text
Wähle eine Textfarbe und klicke auf das Textsymbol 
, um eine Schriftart für Folgendes auszuwählen:
, um eine Schriftart für Folgendes auszuwählen: - Produktname
- Produktpreis
- Preisangaben (z. B. 2.50 €/ 100g)
- „Ausverkauft”-Nachricht
Button
- Buttondesign: Klicke, um das gewünschte Design für deinen Button auszuwählen.
- Füllfarbe & Deckkraft: Klicke auf das Farbfeld, um eine Hintergrundfarbe für den Button auszuwählen. Ziehe den Schieberegler, um die Deckkraft zu ändern.
- Randbreite (px) & Farbe: Klicke auf das Farbfeld, um eine Rahmenfarbe für den Button auszuwählen, und ziehe den Schieberegler, um die Rahmenbreite zu ändern.
- Eckenradius (px): Ziehe den Schieberegler, um den Eckenradius des Buttons zu ändern (Je größer der Radius, umso runder der Button).
- Buttongröße: Ziehe den Schieberegler, um die Größe zu ändern.
- Text - Schriftart & Farbe: Klicke auf das Farbfeld, um eine Textfarbe zu wählen und klicke auf das Textsymbol , um eine Schriftart auszuwählen.
Mouseover
Lege fest, wie sich das Produkt-Widget ändert, wenn Kunden mit der Maus darüber fahren:
- Nichts: Das Widget ändert sich nicht.
- Überlagerung: Eine Farbüberlagerung wird angezeigt.
- Klicke auf das Farbfeld, um eine Überlagerungsfarbe auszuwählen. Ziehe den Schieberegler, um die Deckkraft zu ändern.
- (Optional) Klicke auf das Farbfeld, um die Rahmenfarbe auszuwählen, und ziehe den Schieberegler, um die Rahmenbreite zu ändern.
- (Optional) Klicke auf den Schalter für Mouseover-Zoom:
- Aktiviert: Wenn sich die Maus des Kunden über dem Widget befindet, wird das Produktbild eingezoomt.
- Deaktiviert: Kein Zoom erscheint beim Mouseover.
- Rand: Ein Rahmen erscheint um den Textteil des Widgets.
- (Optional) Klicke auf das Farbfeld, um eine Überlagerungsfarbe auszuwählen. Ziehe den Schieberegler, um die Deckkraft zu ändern.
- Klicke auf das Farbfeld, um die Rahmenfarbe auszuwählen, und ziehe den Schieberegler, um die Rahmenbreite zu ändern.
- (Optional) Klicke auf den Schalter für Mouseover-Zoom:
- Aktiviert: Wenn sich die Maus des Kunden über dem Widget befindet, wird das Produktbild eingezoomt.
- Deaktiviert: Kein Zoom erscheint beim Mouseover.
- Zoom: Das Produktbild wird beim Mouseover eingezoomt.
- (Optional) Klicke auf das Farbfeld, um eine Überlagerungsfarbe auszuwählen. Ziehe den Schieberegler, um die Deckkraft zu ändern.
- (Optional) Klicke auf das Farbfeld, um die Rahmenfarbe auszuwählen, und ziehe den Schieberegler, um die Rahmenbreite zu ändern.
- Klicke auf den Schalter für Mouseover-Zoom:
- Aktiviert: Wenn sich die Maus des Kunden über dem Widget befindet, wird das Produktbild eingezoomt.
- Deaktiviert: Kein Zoom erscheint beim Mouseover.
Banner
Lege das Design der Banner fest. Klicke hier, um zu erfahren, wie du Bänder zu Produkten hinzufügen kannst.
- Füllfarbe & Deckkraft: Klicke auf das Farbfeld, um eine Bannerfarbe auszuwählen. Ziehe den Schieberegler, um die Deckkraft zu ändern.
- Textfarbe: Wähle eine Textfarbe für das Banner aus.
War das hilfreich?
|