CMS: Deine Produkte von Wix Stores auf einer dynamischen Listenseite anzeigen

11 Min. Lesezeit
Verwende das CMS (Content Management System), um deine Produkte von Wix Stores kreativ darzustellen, indem du sie in einem vollständig anpassbaren Repeater auf einer dynamischen Listenseite anzeigst. Wähle nur die Seitenelemente aus, die du benötigst (z. B. Text, Buttons, Bilder) und verbinde diese mit den entsprechenden Feldern deiner Produkte (z. B. Name, Preis, verfügbare Menge).

Du kannst Buttons oder Bilder mit deiner Produktseite verknüpfen, damit Kunden vor dem Kauf darauf klicken können, um mehr zu erfahren. Du kannst auch die Buttons „In den Warenkorb“ und „Schnellansicht“ hinzufügen, um ein nahtloses Einkaufserlebnis zu erzeugen.
Bevor du loslegst:

Schritt 1 | Eine dynamische Listenseite für deine Produkte hinzufügen

Öffne die App-Sammlungen von Wix im CMS deines Editors und erstelle eine dynamische Listenseite aus der Shop-Sammlung. Diese Seite enthält einen Repeater, der bereits teilweise mit deinen Shop-Produkten verknüpft ist.
Wix Editor
Editor X
Studio Editor
  1. Öffne deinen Editor.
  2. Klicke links im Editor auf CMS .
  3. Klicke links auf App-Sammlungen von Wix.
  4. Scrolle nach unten zu Shops, fahre mit der Maus über Produkte und klicke auf das Symbol für Weitere Aktionen .
  5. Klicke auf Dynamische Seite hinzufügen.
  1. Klicke auf Listenseite.
  2. Klicke auf Hinzufügen.
Tipp:
Du kannst deine Produkte in einer Pro Gallery oder Tabelle (nur Wix Editor) anstelle eines Repeaters anzeigen. Entferne dazu den Repeater und füge eine Galerie oder Tabelle hinzu. Folge anschließend den restlichen Schritten in diesem Artikel, um deine Galerie oder deinen Repeater mit dem CMS zu verknüpfen.

Schritt 2 | Deinen Repeater mit dem CMS verknüpfen

Verknüpfe den Repeater mit einem Datensatz, der mit deiner Produktkollektion von Wix Stores verknüpft ist. Verknüpfe dann jedes Repeater-Element mit den dynamischen Werten deiner Sammlung, die sich je nach angezeigtem Produkt ändern. Verlinke ein Bild oder einen Button in deinem Repeater mit der Produktseite von Wix Stores, damit Kunden vor dem Kauf zusätzliche Informationen zu Produkten ansehen können. Du kannst auch „In den Warenkorb“- und „Schnellansicht“-Links erstellen.
Wix Editor
Editor X
Studio Editor
  1. (Optional) Füge Elemente zu deinem Repeater hinzu (z. B. Buttons, Text, Bilder) oder entferne Elemente, die du nicht benötigst. Du kannst die Größe des Repeaters anpassen, sodass alle Elemente darin angezeigt werden können.
  2. Klicke auf das Repeater-Element und wähle das Symbol für Mit CMS verknüpfen .
  3. Klicke auf das Aufklappmenü Datensatz verknüpfen und wähle Produkte aus.
  4. Klicke unter Verknüpfungen auf das Repeater-Element, das du verknüpfen möchtest.
    Hinweis: Wenn du den Standard-Repeater verwendest, der Bestandteil der dynamischen Seite ist, sind die Elemente Bild und Text bereits verknüpft. Du kannst zusätzliche Textelemente löschen oder die Verknüpfung trennen und durch statischen Text ersetzen.
  5. Klicke auf die entsprechenden Aufklappmenüs und wähle die dynamischen Sammlungsfelder von Wix Stores, die du verknüpfen möchtest, oder die Datensatzverknüpfungsoptionen für Buttons und Bilder:
    • Sammlungsfelder von Wix Stores: Wähle die entsprechenden Felder aus, zum Beispiel:
      • Name (Text): Der Produktname, den du in Wix Stores erstellt hast.
      • Formatierter reduzierter Preis (Text): Der in der Währung formatierte Preis (z. B. 20 €).
      • Hauptmedien (Bild): Das Hauptmedienelement (Bild oder Video) für das Produkt.
    • Verlinkungsoptionen für Buttons und Bilder: Klicke auf das Aufklappmenü Beim Klicken verknüpfen mit oder Link ist verknüpft mit und wähle die entsprechende Option aus:
      • Zur Produktseiten-URL navigieren: Öffne die Webadresse der Produktseite auf deiner Website.
      • In den Warenkorb: Fügt das Produkt zum Warenkorb hinzu.
      • Schnellansicht öffnen: Öffnet ein Pop-up mit Details zum Produkt.
  1. Klicke auf Repeater-Verknüpfungen und wiederhole die Schritte 4-5 oben, um weitere Elemente im Repeater zu verknüpfen.
  2. Klicke, um deine Repeater-Elemente nach Bedarf anzupassen.
    Tipp: Du kannst jederzeit Elemente zu deinem Repeater hinzufügen oder daraus entfernen. Trenne die Verbindung zu Elementen, wenn du statische Inhalte verwenden möchtest, die sich nicht entsprechend der jeweiligen Kategorie ändern.
  3. Klicke auf Vorschau, um deine dynamische Produktseite zu testen.
  4. Klicke auf Veröffentlichen, wenn du die Änderungen veröffentlichen möchtest.

Schritt 3 | (Optional) Die Datensatzeinstellungen verwalten

In den Einstellungen deines Datensatzes kannst du die maximale Anzahl von Produkten auswählen, die auf einmal angezeigt werden können. Du kannst auch Filter hinzufügen, um nur bestimmte Produkte einzuschließen, oder Sortierungen hinzufügen, um die Reihenfolge zu steuern, in der die Produkte angezeigt werden.
Wix Editor
Editor X
Studio Editor
  1. Klicke im Editor auf den Repeater, die Pro Gallery oder die Tabelle.
  2. Klicke auf das Symbol für Mit CMS verknüpfen .
  3. Klicke auf Datensatzeinstellungen.
  4. Bearbeite das Feld Maximale Anzahl angezeigter Elemente, um die maximale Anzahl von Produkten festzulegen, die gleichzeitig auf der Seite geladen werden können. Dies ist auch die maximale Anzahl an Produkten, die pro Seite in einer verknüpften Seitennummerierungsleiste oder per Klick auf einen „Mehr laden“-Button oder „Nächste/Vorherige Seite“-Button geladen werden können.
    Hinweis: Dieses Feld gilt nicht für Tabellen. Wenn du eine Tabelle verwendest, um deine Elemente anzuzeigen kannst du die Anzahl der angezeigten Elemente begrenzen, indem du in der Tabelle auf das Symbol für Layout klickst, um dann eine benutzerdefinierte Tabellenhöhe festzulegen und die Seitennummerierung zu aktivieren.
  5. (Optional) Klicke auf + Filter hinzufügen, um im Repeater nur bestimmte Produkte anzuzeigen.
  6. (Optional) Klicke auf + Sortierung hinzufügen, um die Reihenfolge auszuwählen, in der die Produkte im Repeater angezeigt werden.
  7. Klicke auf Vorschau, um deine dynamische Produktseite zu testen.
  8. Klicke auf Veröffentlichen, wenn du die Änderungen veröffentlichen möchtest.

Schritt 4 | (Optional) Kunden ermöglichen, Produkte zu filtern

Gib Besuchern die Möglichkeit, nur Produkte anzuzeigen, die den von ihnen angewendeten Filtern entsprechen wie zum Beispiel Preis, Bestand oder Marke. Wähle eines der folgenden Eingabeelemente, die das Filtern ermöglichen: Radiobuttons, Kontrollkästchen, DropdownAuswahl-Tags oder Schieberegler (nur Bereichsschieberegler).

Schritt 5 | (Optional) „Mehr laden“- oder Navigationsbuttons hinzufügen

Du kannst die Leistung deiner Seite verbessern, indem du die Anzahl der angezeigten Produkte beschränkst und einen „Mehr laden“-Button hinzufügst.

Füge Navigationsbuttons hinzu, damit Käufer die nächsten/vorherigen Artikel anzeigen können oder füge eine Seitennummerierungsleiste hinzu, um gleichzeitig durch eine bestimmte Anzahl von Produkten zu blättern.
Tipp:
Mehr erfahren über die Aktionen für CMS-Datensätze, die du auf Buttons und Bilder anwenden kannst.

War das hilfreich?

|