Komponenten
Die verwendeten Komponenten in einer Reihe aufgereiht! 📋
Akkordeon-Komponente
Die Akkordeon-Komponente wurde größtenteils aus der Akkordeon-Komponente des Themes Horizon übernommen. Wenn das Akkordeon den Text „Merkmale“ oder „Kenmerken“ enthält, werden hinter dem Titel innerhalb des Akkordeons Symbole hinzugefügt.
Beschreibung
Unser Ziel ist es, dass jeder Kunde mit seinem Einkauf voll und ganz zufrieden ist. Sollte dies nicht der Fall sein, lassen Sie es uns bitte wissen. Wir tun unser Bestes, um gemeinsam mit Ihnen eine gute Lösung zu finden.
Zutaten
Wir werden deine Bestellung so schnell wie möglich versenden. Sobald deine Bestellung versandt wurde, erhältst du eine E-Mail mit weiteren Informationen. Die Lieferzeiten sind von deinem Standort abhängig.
Nährwerte
Unsere Produkte werden sowohl lokal als auch weltweit hergestellt. Wir wählen unsere Produktionspartner sorgfältig aus, um sicherzustellen, dass unsere Produkte von hoher Qualität sind und einen fairen Preis haben.
Merkmale
Unsere Produkte werden sowohl lokal als auch weltweit hergestellt. Wir wählen unsere Produktionspartner sorgfältig aus, um sicherzustellen, dass unsere Produkte von hoher Qualität sind und einen fairen Preis haben.
Button-Komponente
Über ein Button-Block kannst du einen Button zum Abschnitt hinzufügen und diesen nach Belieben einstellen.
Verfügbare Einstellungen pro Button
- Label & Link: passe den Text und den Link des Buttons an. Optional kannst du den Link in einem neuen Tab öffnen.
- Style: wähle einen der fünf verfügbaren Stile: Primary, Secondary, Ghost, Icon oder Link.
- Größe: Mit "Make button small" aktivierst du die kleine Variante des Buttons. Dabei wird das Padding proportional mit einem Verhältnis von 1,5 verkleinert.
- Farben: über "Overwrite button colors" überschreibst du die Standardfarben des Farbschemas und stellst eigene Farben pro Button ein.
- Icon: aktiviere "Add icon", um ein Icon hinzuzufügen. Dies zeigt zwei zusätzliche Felder: den Icon-Namen (basierend auf Google Material Icons) und die Position des Icons innerhalb des Buttons.
- Breite: stelle die Breite separat für Desktop und Mobil ein. Standardmäßig ist diese auf "fit" eingestellt, kann aber angepasst werden.
Theme-Einstellungen
In den Einstellungen jedes Farbschemas wurden zusätzliche Optionen für die Button-Varianten Ghost und Icon hinzugefügt. Darüber hinaus sind unter den allgemeinen Button-Einstellungen auch separate Einstellungen für diese beiden Varianten verfügbar.
Badge-Komponente
Durch das Laden des Snippets 'badge.liquid' kann ein Badge hinzugefügt werden.
Die Anpassungen für die Badges basieren weitgehend auf den Standardeinstellungen des Badges-Themes. Unter Theme Settings -> Badges sind die folgenden Einstellungen verfügbar:
- Corner radius: bestimmt den Radius der Badges
- Paddings: Hier können die Inline- und Block-Paddings separat eingestellt werden
- Typography: Unter dieser Einstellung kann festgelegt werden, welcher Schriftarttyp verwendet werden soll und ob diese in Großbuchstaben angezeigt werden soll oder nicht
- Standard badge colors: Stellen Sie die Farben der Standard-Badges ein
- Disabled badge colors: Stellen Sie die Farben der ausverkauften/deaktivierten Badges ein
- Highlight badge colors: Stellen Sie die Farben der hervorgehobenen Badges ein
Der Komponente können die folgenden Props übergeben werden:
- Text
- Farbe
- Hintergrundfarbe
Preiskomponente
Unter Theme settings wurden unter Prices neue Einstellungen hinzugefügt, die die Option bieten, das Währungssymbol anzuzeigen oder nicht.
Außerdem wurden dem Block Price weitere Einstellungen hinzugefügt:
- Reviews information: zeigt die Bewertungen auf dem Desktop an
- Display: bestimmt, ob der Preis vertikal oder horizontal angezeigt wird
- Main price color: bestimmt die Farbe des Hauptpreises
- Preset: bestimmt die Schriftgröße des Hauptpreises
Produktkarte
In den Produktkarten- Einstellungen können verschiedene Einstellungen angepasst werden.
- Vertikaler Abstand: bestimmt den vertikalen Abstand zwischen den Elementen in der Produktkarte
- Farbschema vererben: bestimmt, ob die Karte das Farbschema erbt.
- Badge-Position: richtet die Badges links oder rechts aus
- Stil: bestimmt, ob die Produktkarte einen Rahmen enthält
- Eckenradius: bestimmt die Anzahl der Pixel für den Rahmenradius
- Padding (oben, unten, links und rechts): legt das Padding fest
Zur Produktkarte kann auch ein Floating group-Block hinzugefügt werden. Dieser Block enthält ebenfalls eine Reihe von Einstellungen:
- Ausrichtung & Position: Position des Elements innerhalb des Blocks
- Padding (oben, unten, links und rechts): legt das Padding fest
- Gruppe nur bei Hover anzeigen: zeigt den Block nur beim Hovern an
Momentan beliebt
Eine Auswahl der meistgesuchten Produkte
Momentan beliebt
Eine Auswahl der meistgesuchten Produkte
Momentan beliebt
Eine Auswahl der meistgesuchten Produkte