Der Block „Flexible Produktauswahl“ zeigt eine selbst zusammengestellte Produktreihe an beliebiger Stelle – mit allen Einstellungen, 18 Stilen und den Schritten im Editor.
In dieser Anleitung
Worum es geht
Der Block „OBS: Flexible Produktauswahl“ (im Editor englisch: „OBS: Flexible product selection (Beta)“) zeigt eine selbst zusammengestellte Produktreihe an beliebiger Stelle – z. B. „Neu eingetroffen“, „Angebote ab 20 %“, „Halloween-Kollektion“ oder „Unsere Fahrzeuge“. Dazu gehören eine Überschrift, ein kurzer Text und der Link „Alle anzeigen“. Wie die Produktkarten aussehen, bestimmen der Stil und der innere Block OBS Products (siehe Freie Blöcke: Produktauswahl, Zuletzt angesehen, Modellauswahl und OBS Products). Eingefügt wird er über die Kit-Vorlagen „OBS Produktauswahl“ bzw. „OBS Produktauswahl – Fahrzeuge“ (siehe Vorlagen des OBS Design Kits einfügen).
Im Shop
So sieht es aus im Shop
Im Editor
Einrichtung Schritt für Schritt
01
Vorlage einfügen:
+ → Vorlagen → Kategorie „OBS Produktauswahl“ (bzw. „… – Fahrzeuge“) → Vorlage anklicken.
02
Block auswählen:
Ein Klick in den Abschnitt wählt die ganze Vorlage. Rechts stehen Name und Beschreibung der Vorlage, darunter die Texte (Überschrift, Buttons, Absatz). Über dem Abschnitt zeigt ein grüner Hinweis, wie viele Produkte gefunden werden.
03
Vorlage bearbeiten:
In der Seitenleiste Vorlage bearbeiten klicken – erst dann sind Produktauswahl und Stil einstellbar. Oben steht nun „Vorlage verlassen“.
04
Produkte festlegen
(Zahnrad) und Stil wählen (Halbkreis) – siehe unten.
05
Vorlage verlassen → Speichern.
Einstellungen (Zahnrad)
| Einstellung (im Editor) | Optionen / Bereich | Standard | Wirkung | Im Beispiel „Angebote ab 20 %“ |
|---|---|---|---|---|
| Minimum number of products | 1–96 | 1 | Der ganze Abschnitt (mit Überschrift und Text) erscheint erst, wenn mindestens so viele anzeigbare Produkte gefunden werden – nicht die angezeigte Anzahl (die steht in OBS Products) | 4 |
| Fixed products (wrapper IDs) | Produktnummern, mit „Add“ | leer | Feste Produkte in genau dieser Reihenfolge; sobald eine ID steht, zählen die Kriterien darunter nicht mehr (keine Varianten-IDs) | leer |
| Categories (including subcategories) | Warengruppen | leer | Nur Produkte dieser Warengruppen (inkl. Unterkategorien) | leer |
| Brands | Marken | leer | Nur Produkte dieser Marken | leer |
| Search term | Freitext | leer | Wird wie die Shopsuche behandelt | leer |
| Facets (text) | Merkmal + Wert, „Add text facet“ | leer | z. B. Farbe = schwarz; mehrere Facetten müssen für dieselbe Variante gelten | leer |
| Facets (number range) | Merkmal + From/To, „Add number facet“ | leer | Zahlenmerkmal von–bis (z. B. Preisnachlass % 20–100, Preis bis 50, PS ab 100); darunter steht der Wertebereich im Bestand | Preisnachlass % 20–100 |
| Order | Shop default · New products · Price ascending · Price descending · Relevance | Shop default | Sortierung der gefundenen Produkte; gilt nicht für feste Produkte | Shop default |
Logik: Alle ausgefüllten Kriterien müssen zutreffen (UND); mehrere Werte in einem Kriterium sind Alternativen (ODER); leere Kriterien schränken nicht ein. Beispiel: Warengruppen „Bekleidung“ und „Accessories“ + Marke „Harley-Davidson“ → Harley-Davidson-Artikel aus Bekleidung oder Accessories.
Die Darstellung (Anzahl, „Mehr laden“, Bildformat, Rabatt-Anzeige …) stellst Du im inneren Block OBS Products ein – in der Pfadleiste unten „… › OBS Products“ wählen (Details in Freie Blöcke: Produktauswahl, Zuletzt angesehen, Modellauswahl und OBS Products).
Die 18 Stile
Stile (Halbkreis)
Es gibt 18 Stile. Die Zahl im Namen ist die Anzahl Karten pro Reihe am Desktop. Dezimalzahlen bei Slidern zeigen, wie viele Karten sichtbar sind (die angeschnittene Karte signalisiert das Wischen).
| Stil | Desktop | Tablet | Handy | Art | Gut für |
|---|---|---|---|---|---|
| Standard | 4 | 3 | 2 | Raster | allgemeine Produktreihen |
| Raster 2 | 2 | 2 | 1 | Raster | wenige, große Produkte (Neuheit, Aktion) |
| Raster 3 | 3 | 3 | 2 | Raster | etwas größere Karten |
| Raster 5 | 5 | 3 | 2 | Raster | mehr auf einen Blick |
| Raster 6 | 6 | 4 | 2 | Raster | viele kleine Teile, Zubehör |
| Slider 3 | 3 | 2,3 | 1,3 | Slider | große Karten in einer Reihe |
| Slider 4 | 4 | 3,3 | 2,3 | Slider | Standard-Slider |
| Slider 5 | 5 | 3,3 | 2,3 | Slider | — |
| Slider 6 | 6 | 4,3 | 2,5 | Slider | viele kleine Karten |
| Liste | 3 | 2 | 1 | Raster | Bild links, Text rechts – lange Produktnamen |
| Liste-Slider | 3 | 2,2 | 1,15 | Slider | kompakt, z. B. „Passt dazu“, Zubehör |
| Doppelreihe | 3 × 2 | 2,2 × 2 | 1,15 × 2 | Slider | zwei Reihen, die zusammen wischen |
| Mini 6 | 6 | 4 | 3 | Raster | kleine Karten ohne Marke/Lagerstand |
| Mini-Slider | 6 | 4,3 | 3,2 | Slider | kleine Karten zum Wischen |
| Fahrzeug 1 | 1 | 1 | 1 | Liste | ein Fahrzeug pro Zeile: Bild, Eckdaten, Preis |
| Fahrzeug 2 | 2 | 1 | 1 | Raster | große Fahrzeugkarten |
| Fahrzeug 3 | 3 | 2 | 1 | Raster | drei Fahrzeuge nebeneinander |
| Fzg-Slider 2 | 2 | 1,6 | 1,15 | Slider | zwei große Fahrzeuge zum Wischen |
| Fzg-Slider 3 | 3 | 2,3 | 1,1 | Slider | drei Fahrzeuge zum Wischen |
Ein paar Stile als Beispiel (je Stil gibt es ein Desktop- und ein Handy-Bild):
Bei den Raster-Stilen sind für die Aufnahme nur zwei Reihen sichtbar; im Shop zeigt der Block so viele Produkte, wie in OBS Products bei „Anzahl Produkte“ steht.
Gut zu wissen
Verhalten
- Erscheinen: Der Abschnitt erscheint nur, wenn mindestens „Minimum number of products“ Produkte gefunden werden – sonst fehlt er im Shop ganz (samt Überschrift und Text). Im Editor warnt ein Hinweis.
- Slider: „Mehr laden“ ist in Slider-Stilen immer ausgeblendet – dafür den Link „Alle anzeigen“ setzen.
- Pfeile am Desktop: Alle Slider haben ein Pfeilpaar unten rechts (am Anfang/Ende blass); eine feine Linie zeigt die Position. Auf Handy und Tablet wird gewischt.
- Rabatt-Schild: Auf kleinen Karten (Mini 6, Mini-Slider, Raster 6, Slider 6) und auf dem Handy ist das orange Rabatt-Schild kleiner.
- Kompakte Stile (Liste, Liste-Slider, Doppelreihe) blenden Rabatt-Schild, Varianten-Vorschaubilder und Merkmale aus.
- Fahrzeug-Stile zeigen die Eckdaten aus OBS Products → „Facetten-Codes“ (z. B. Fahrzeugtyp, Standort, Erstzulassung, Kilometer, PS, Hubraum).
HINWEISE UND AUFFÄLLIGKEITEN
- Die Einstellungen sind in der Beta noch englisch beschriftet.
- Der Vorlagen-Name (z. B. „Raster 4 pro Reihe · Angebote“) beschreibt den Zustand beim Einfügen. Wer danach einen anderen Stil wählt, ändert nur das Aussehen – der Name der Vorlage bleibt.
- Feste Produkte (Wrapper-IDs) schlagen alle Kriterien. Wenn „nichts passiert“, prüfen, ob noch eine ID eingetragen ist.
- Facetten werden pro Variante geprüft: „Farbe schwarz“ + „Größe XL“ findet nur Produkte, die eine schwarze XL-Variante haben.
- Die Stil-Klasse steht im Feld „Zusätzliche CSS-Klasse(n)“. Dort nichts löschen, sonst springt der Block auf „Standard“.
WEITERLESEN