Shop-Blöcke: Produktraster, Produkt, Warenkorb und Kasse

Zeigen Sie Ihre Produkte und nehmen Sie Bestellungen entgegen mit den Shop-Blöcken Produktraster, Einzelnes Produkt, Produktseite, Warenkorb, Kasse und Bewertungen, und erfahren Sie, was jede Einstellung bewirkt.

Shop-Blöcke zeigen, was Sie verkaufen, und lassen Kunden es kaufen. Sie finden sie in der Gruppe Shop im linken Bereich. Die Produkte selbst verwalten Sie in Ihrem Website-Dashboard, nicht im Editor. Die Blöcke zeigen sie nur an. Wenn Sie also einen Preis ändern oder ein Produkt hinzufügen, aktualisiert sich jeder Block, der es zeigt.

Die Shop-Blöcke im Überblick

BlockWas er zeigt
ProduktrasterMehrere Produkte in einem Raster, etwa Ihre Shop-Seite oder eine Zeile mit Bestsellern.
Einzelnes ProduktEin Produkt als Karte, um es an beliebiger Stelle hervorzuheben.
ProduktseiteDie vollständige Seite eines Produkts: Fotos, Preis, Beschreibung und der Button „In den Warenkorb“.
WarenkorbWas der Kunde ausgewählt hat, mit Gesamtsumme und einem Kassen-Button.
KasseDas Formular, in dem der Kunde seine Daten eingibt und bezahlt.
BewertungenDie Bewertungen und Rezensionen zu einem Produkt.

Ihre Website hat bereits eine Warenkorb-Seite und eine Kassen-Seite, jeweils mit ihrem Block, und ein gemeinsames Layout für Produktseiten. Sie müssen den Warenkorb-, Kassen- oder Produktseiten-Block selten selbst hinzufügen.

Produktraster

Ziehen Sie ein Produktraster auf eine Seite und klicken Sie es an, um seine Einstellungen zu öffnen.

Das Produktraster „Bestsellers“ im Editor ausgewählt, mit den Einstellungen Kategorie, Sortierung, Wie viele angezeigt werden und weiteren im Einstellungsbereich

Unter Allgemein:

  • Kategorie beschränkt das Raster auf eine Kategorie oder zeigt Alle Produkte.
  • Sortierung ordnet die Produkte: Manuell festgelegt, Neueste zuerst, Name A-Z, Preis aufsteigend oder Preis absteigend.
  • Wie viele angezeigt werden begrenzt die Zahl der Produkte. Bei Alle erscheint jedes Produkt.
  • Filter für Käufer fügt Buttons hinzu, mit denen Kunden das Raster eingrenzen können: Nach Kategorie, Nach Schlagwort oder Nach Kategorie und Schlagwort.
  • Produkte pro Seite teilt ein langes Raster in Seiten auf. Bei Alle auf einer Seite gibt es keine Seitenaufteilung.
  • Nach dem Hinzufügen direkt zur Kasse schickt Kunden direkt zur Kasse, sobald sie etwas hinzufügen. Lassen Sie diese Option aus, wenn die meisten Kunden mehr als einen Artikel kaufen.
  • Produkte in einem Pop-up öffnen zeigt ein Produkt in einem Pop-up, damit Kunden ihre Stelle im Raster behalten. Ist die Option aus, öffnet ein Klick auf ein Produkt seine eigene Seite. Pfeile zwischen Produkten und die beiden Pfeilfarben gelten für dieses Pop-up.

Legen Sie unter Darstellung die Anzahl der Spalten, den Rasterabstand und die Form des Bildes fest. Schalten Sie Preis anzeigen, Kategorie anzeigen und Button „In den Warenkorb“ anzeigen ein oder aus, ändern Sie den Button-Text und legen Sie Kartenhintergrund und Textfarbe der Karte fest.

Die Shop-Seite im veröffentlichten Shop, mit Filter-Buttons für Kategorien über einer Reihe von Produktfotos

Wie Sie Produkte organisieren, lesen Sie unter Produkte mit Kategorien und Schlagwörtern organisieren. Wie Sie aus einer Seite Ihren Shop machen, lesen Sie unter Ihre Shopseite einrichten.

Einzelnes Produkt

Verwenden Sie Einzelnes Produkt, um einen Artikel auf einer beliebigen Seite zu zeigen, etwa auf Ihrer Startseite. Wählen Sie ihn unter Produkt aus. Sie können die Form des Bildes ändern, den Preis und den Button „In den Warenkorb“ ein- oder ausblenden, den Button-Text ändern und die Kartenfarben festlegen.

Produktseite

Die Seite, die alle Produkte gemeinsam haben, gestalten Sie nur einmal. Wählen Sie in der Seitenliste oben im Editor Produktvorlage. Sie zeigt als Platzhalter Ihr erstes Produkt, aber alles, was Sie ändern, gilt für alle.

Die Produktvorlage im Editor, die die Stoneware Mug mit Foto, Preis, Beschreibung und dem Button „In den Warenkorb“ zeigt

Klicken Sie den Block Produktseite an, um Teile ein- oder auszuschalten: Fotogalerie, Beschreibung, SKU und Bewertungen. Auch den Button-Text können Sie ändern. Legen Sie unter Zurück-Link fest, wohin der Link über dem Produkt führt und was er sagt. Standardmäßig führt er zu Ihrer Shop-Seite. Mehr dazu unter So funktionieren Produktseiten.

Warenkorb

Der Block Warenkorb befindet sich auf Ihrer Warenkorb-Seite. Seine Einstellungen sind die Überschrift, die Meldung bei leerem Warenkorb, Gesamtsumme anzeigen und der Text des Kassen-Buttons, dazu die Hintergrund- und Textfarben. Der Warenkorb eines Kunden wird im eigenen Browser gespeichert, bis er zur Kasse geht.

Das Warenkorb-Symbol in Ihrer Kopfzeile öffnet ein Warenkorb-Fenster auf derselben Seite, sodass Kunden selten verlassen müssen, was sie gerade ansehen.

Das Warenkorb-Fenster im veröffentlichten Shop, das ein Produkt mit Preis und Menge, eine Gesamtsumme und einen Kassen-Button zeigt

Kasse

Der Block Kasse ist Ihre Kassen-Seite. Er zeigt links die Daten des Kunden und rechts seine Bestellung, einen eventuellen Rabattcode und die Bezahl-Buttons.

Der Block „Kasse“ im Editor ausgewählt, mit Datenformular, Bestellübersicht und Bezahl-Buttons und seinen Einstellungen im Bereich

Unter Allgemein:

  • Überschrift ist der Titel über dem Formular.
  • Versandadresse erfassen fügt die Felder für Adresse, Ort, Bundesland, Postleitzahl und Land hinzu. Versandzonen und ortsabhängige Steuern nutzen die Adresse, um den Satz zu ermitteln. Lassen Sie die Option also an, wenn Sie diese eingerichtet haben.
  • Telefonnummer erfassen und Bestellhinweise zulassen fügen diese optionalen Felder hinzu.
  • Website-Menü anzeigen und Fußzeile anzeigen sind standardmäßig aus, sodass Kunden nur Ihr Logo sehen und sich aufs Bezahlen konzentrieren. Schalten Sie eine der beiden Optionen ein, um sie zurückzuholen.

Die übrigen Gruppen gestalten die Seite:

  • Kartenbutton ändert Text, Farben und Symbol des Kreditkarten-Buttons.
  • PayPal-Button bietet die eigene Beschriftung und die Farben von PayPal. PayPal erlaubt bei einem Button, der seinen Namen trägt, nichts anderes.
  • Beide Buttons legt Eckenradius, Größe, Anordnung (Gestapelt oder Nebeneinander) und die Reihenfolge der Buttons fest.
  • Rabattcode legt die Größe des Codefeldes fest. Das Feld erscheint nur, solange Sie einen Code haben, den Kunden verwenden können.
  • Hinweis unter den Buttons schaltet eine beruhigende Zeile ein oder aus, lässt Sie einen eigenen Text schreiben und legt ihre Ausrichtung fest.

Die Bezahl-Buttons erscheinen, wenn Stripe oder PayPal verbunden ist. Siehe So funktioniert die Kasse.

Bewertungen

Der Block Bewertungen zeigt die Bewertungen und geschriebenen Rezensionen zu einem Produkt. Wählen Sie es unter Produkt aus, geben Sie ihm eine Überschrift und schalten Sie Bewertungsübersicht anzeigen und Kunden das Schreiben von Bewertungen erlauben ein oder aus. Bewertungen werden geladen, wenn jemand die Seite besucht, neue erscheinen also ohne erneutes Veröffentlichen. Nur angemeldete Kunden können eine schreiben. Produktseiten enthalten Bewertungen bereits, verwenden Sie diesen Block also, wenn Sie sie an anderer Stelle haben möchten. Siehe Produktbewertungen sammeln und moderieren.

Weiterführende Artikel

Last updated 2026-10-03