# SW 6.6.9.0 Entwicklung eines erweiterten dynamischen Produkt-Listings in Shopware 6 **URL:** \ **Category:** Programmierung\ **Tags:** programming, customelements\ **Created:** [7. Januar 2025 um 03:01 UTC](https://forum.shopware.com/t/sw-6-6-9-0-entwicklung-eines-erweiterten-dynamischen-produkt-listings-in-shopware-6/106211 "2025-01-07T03:01:47Z")\ **Posts on this page:** 1\ **Page:** 1
**Author:** ![ar24](https://avatars.discourse-cdn.com/v4/letter/a/41988e/32.png) [@ar24](https://forum.shopware.com/u/ar24)\ **Post date:** [7. Januar 2025 um 03:01 UTC](https://forum.shopware.com/t/sw-6-6-9-0-entwicklung-eines-erweiterten-dynamischen-produkt-listings-in-shopware-6/106211/1 "2025-01-07T03:01:47Z")
Hallo liebe Community, ich arbeite aktuell an einem erweiterten Produkt-Listing-Block für unseren Shop, der zwei Bereiche integriert: 1. **Ein anpassbarer Custom-Bereich** zur individuellen Präsentation der ersten Produkte einer Kategorieseite. 2. **Ein dynamischer Bereich** für alle restlichen Produkte der Kategorie mit Standard-Shopware-Features wie Filter und Sortierungen. **Ziele und Funktionen** **1. Custom-Bereich für die ersten Produkte** • **Ziel:** Manuelle Auswahl und Darstellung der ersten Produkte im **4er-Grid**. • **Funktionen:** • Hinzufügen beliebig vieler **Custom-Zeilen** mit je **4 Produkt-Slots**. • Produkte können per **Drag-and-Drop** sortiert werden. • Vorschau im Backend zeigt das Layout wie in der Storefront. • Produkte im Custom-Bereich werden im dynamischen Bereich automatisch ausgeschlossen. • **Besonderheit:** Wenn Filter oder Sortierungen aktiv sind, sollen Custom-Zeilen verschwinden und ihre Produkte in das dynamische Listing übernommen werden. **2. Dynamischer Bereich für alle restlichen Produkte** • **Ziel:** Automatisches Listing für alle nicht im Custom-Bereich verwendeten Produkte. • **Funktionen:** • Dynamisches Nachladen mit Button („Weitere Produkte laden“). • Unterstützung aller Shopware-Standardfilter (Preis, Eigenschaften, Hersteller etc.). • Sortierungen wie „Preis aufsteigend“ oder „Neuheiten“ funktionieren automatisch. • **Wichtig:** Custom-Produkte dürfen nicht doppelt angezeigt werden. **3. Erweiterung im Backend – Benutzerfreundlichkeit** • **Ziel:** Einfache Bedienbarkeit, auch für nicht-technische Nutzer. • **Funktionen:** • **Drag-and-Drop** -Bearbeitung des Custom-Bereichs. • Vorschau im Backend stellt das Frontend-Layout 1:1 dar. • Klare Trennung zwischen Custom- und dynamischem Bereich, um die Übersichtlichkeit zu gewährleisten. **Zusätzliche Layout-Optionen im Custom-Bereich** Für jede Custom-Zeile soll ein **Dropdown-Menü** verschiedene Layouts bieten: 1. **Normale 4er-Zeile:** Standard-Grid mit 4 gleich großen Produkt-Slots. 2. **4 Produkte links, Störer-Bild rechts:** Links ein 4er-Produkt-Grid, rechts ein Bild oder eine Aktion (über 2 Spalten und 2 Zeilen). 3. **Störer-Bild links, 4 Produkte rechts:** Spiegelverkehrt zur zweiten Option. **Meine Fragen zur Umsetzung:** 1. **Wie kann ich das Standard-Produkt-Listing in den Erlebniswelten so erweitern, dass neue Felder in der Konfiguration möglich sind?** • Beispiel: Ein **Dropdown-Menü** für Layout-Optionen und ein Bereich für Drag-and-Drop-Slots. 1. **Welche Dateien müssen überschrieben werden (** sw-cms-el-config-product-listing.vue\*\*,\*\* index.js **etc.)?** 2. **Gibt es Best Practices, um ein Override für die Konfiguration umzusetzen, ohne den Core zu verändern?** 3. **Wie kann ich sicherstellen, dass der Custom-Bereich im Frontend nicht durch Shopware-Filter beeinflusst wird?** 4. **Gibt es Code-Beispiele oder Hinweise, wie man ein Drag-and-Drop-System für CMS-Komponenten umsetzt?** 5. **Wie verhindere ich effizient Duplikate, indem ich IDs der Custom-Produkte im dynamischen Listing ausschließe?** Ich freue mich über Tipps, Code-Beispiele oder Erfahrungsberichte und danke euch schon im Voraus für eure Unterstützung! 😊 **Beste Grüße** A.R.