Dein Shop entsteht aus Templates, Blöcken und fertigen Vorlagen – nicht Seite für Seite. Diese Seite erklärt, wie das zusammenhängt und wie Du im Editor damit arbeitest.
Worum es geht
Dein Shop entsteht nicht Seite für Seite von Hand. Stattdessen baust Du einmal Vorlagen (Templates) und setzt sie aus Blöcken zusammen; der Shop füllt sie dann automatisch mit den Daten aus Deinem Warenwirtschaftssystem. Diese Seite erklärt die Begriffe und wie Du im Editor damit arbeitest – die einzelnen Blöcke und fertigen Kit-Vorlagen behandeln die weiteren Seiten.
Die neuen Blöcke, die Kit-Vorlagen und das Design Kit bauen auf dem offiziellen WordPress-Block-Theme Twenty Twenty-Five auf. Die früher ausgelieferten Themes (Elementor Hello, OceanWP) sind damit eine ältere Variante (siehe Das Theme anpassen).
HINWEIS
Einige Einstellungsnamen in der Seitenleiste sind in der aktuellen Beta noch englisch. Wir nennen sie jeweils englisch und erklären sie auf Deutsch.
Drei Arten von Seiten
| Seitenart | Beispiel | Wo bearbeiten? | Gilt für |
|---|---|---|---|
| Produktseite | ein T-Shirt, ein Fahrzeug | Produkt-Template (Menü „OBS Produkt Templates“) | alle zugeordneten Produkte |
| Kategorieseite (Warengruppe) | „Bekleidung“, „Fahrzeuge“ | Kategorie-Template (Menü „OBS Kategorie Templates“) | alle zugeordneten Warengruppen |
| Inhaltsseite | Startseite, „Über uns“ | die Seite selbst (Seiten → bearbeiten) | nur diese eine Seite |
WICHTIG
Produkt- und Kategorieseiten werden nicht einzeln gepflegt. Du baust einmal ein Template, und eine Änderung daran wirkt sofort auf alle zugeordneten Seiten. Die Inhalte (Bilder, Preis, Merkmale, Produktlisten) kommen automatisch aus dem Warenwirtschaftssystem.
Drei Gruppen von Blöcken
| Gruppe | Einsetzbar in | Beispiele |
|---|---|---|
| Produktseiten-Blöcke | nur im Produkt-Template | Produkt Bild, Preis, Varianten, Kaufen-Button, Merkmale, Passende Produkte |
| Kategorieseiten-Blöcke | nur im Kategorie-Template | Brotkrume, Titel, Filter, Sortierung, Produktliste |
| Freie Blöcke | auf allen Seiten | Produktauswahl, Zuletzt angesehen, Modellauswahl, Overlay mit Anfrageformular |
Produktseiten-Blöcke lesen „das aktuelle Produkt“, Kategorieseiten-Blöcke „die aktuelle Warengruppe“. Auf einer normalen Inhaltsseite gibt es beides nicht – deshalb sind diese Blöcke dort nicht verfügbar.
Produktlisten: Anbieter + Ansicht „OBS Products“
Überall, wo mehrere Produkte als Karten erscheinen, arbeiten zwei Dinge zusammen: ein Anbieter (woher die Produkte kommen) und die gemeinsame Ansicht „OBS Products“ (wie die Karten aussehen).
| Anbieter | liefert | typischer Ort |
|---|---|---|
| Kategorie-Produktliste | Produkte der aktuellen Warengruppe, mit Filtern | Kategorieseite |
| Produktauswahl (flexibel) | selbst zusammengestellte Produkte (Warengruppe, Marke, Suchbegriff …) | überall |
| Passende Produkte | Zubehör/Ersatzteile zum aktuellen Produkt (Fit-Gruppen) | Produktseite |
| Zuletzt angesehen | die zuletzt angesehenen Produkte des Besuchers | überall |
Die Ansicht „OBS Products“ ist bei allen gleich (Anzahl, Bildformat, Rabatt-Anzeige …) – wer sie einmal versteht, kann jede Produktliste einstellen. Das Aussehen (Raster, Slider, Liste, Fahrzeuge) wählst Du als Stil am Anbieter. Details stehen auf der Seite zu den freien Blöcken.
Vorlagen des Design Kits
Das OBS Design Kit liefert fertige Vorlagen – komplette, gestaltete Abschnitte (z. B. „Produktauswahl · Slider · Neu eingetroffen“). Statt Blöcke einzeln zusammenzusetzen, fügst Du eine Vorlage ein und passt Texte und Einstellungen an.
So fügst Du eine Vorlage ein: Im Editor oben links auf + → Reiter Vorlagen → eine Kategorie wählen (z. B. „OBS Produktauswahl“) → Vorlage anklicken oder an die Stelle ziehen. Welche Kategorien erscheinen, hängt vom Ort ab (im Produkt-Template Produktseiten-Vorlagen usw.).
Im Editor arbeiten: „Vorlage bearbeiten“
Eingefügte Vorlagen sind zunächst geschützt: Ein Klick wählt die ganze Vorlage aus; die Seitenleiste zeigt Namen, Beschreibung und die änderbaren Texte. So änderst Du Überschrift und Text, ohne den Aufbau zu zerstören.
Um Block-Einstellungen zu ändern: Vorlage anklicken → Vorlage bearbeiten → einzelnen Block auswählen (z. B. die Produktauswahl) und rechts einstellen → Vorlage verlassen → Speichern.
TIPP
Die Pfadleiste unten im Editor zeigt, welcher Block gerade ausgewählt ist; ein Klick darauf wählt den übergeordneten Block.
Live-Vorschau im Editor
Die OBS-Blöcke zeigen im Editor echte Shop-Daten; Änderungen (z. B. Suchbegriff oder Anzahl) aktualisieren die Vorschau sofort. Über der Produktauswahl steht ein grüner Hinweis, ob genug Produkte gefunden wurden. Im Produkt-Template zeigt der Editor ein Beispielprodukt; Blöcke ohne Daten zeigen einen grauen Hinweistext statt Produkten.
Wo wird was eingestellt?
| Was | Wo |
|---|---|
| Aufbau/Gestaltung einer Produkt- oder Kategorieseite | im jeweiligen Template |
| Welche Produkte eine Produktauswahl zeigt | Seitenleiste der Produktauswahl (nach „Vorlage bearbeiten“) |
| Aussehen der Karten (Anzahl, Bildformat, Rabatt …) | Seitenleiste „OBS Products“ |
| Raster, Slider, Liste … | Seitenleiste des Anbieters → Stile |
| Welche Merkmale/Filter erscheinen und Reihenfolge | Seitenleiste „Produkt Merkmale“ bzw. „Kategorie Filter“ → Features Selection |
| Modellauswahl-Felder, Spalten der Modell-Tabelle | OBS-System → Optionen, Bereich Modellauswahl |
| Produktdaten (Bilder, Texte, Preise, Merkmale, Fit-Gruppen) | im Warenwirtschaftssystem, nicht in WordPress |
| Farben, Schriften, Abstände | zentral im Design Kit – nicht je Block |
Nach dem Speichern
Leere den Seiten-Cache, wenn Änderungen im Shop nicht erscheinen (der Shop ist für schnelle Ladezeiten zwischengespeichert). Prüfe die Seite in einem privaten Fenster und sowohl am Desktop als auch auf dem Handy.
WEITERLESEN