# Produktbereich (Showcase) > **Was Sie lernen werden** > > * Einrichtung und Anpassung des Produktlayouts „Showcase“ in Plain Jane > * Wichtige Designoptionen wie mobile Ausrichtung, Bildlaufleisten, Zoom und Popup-Styling > * Wann dieses Layout für das beste Kundenerlebnis verwendet werden sollte *** ### 🖼 Was ist das Showcase-Layout? Die **Showcase-Layout** bietet ein zentriertes Bildlayout mit Produktinformationen auf beiden Seiten. Es eignet sich hervorragend für minimalistische, moderne Shops, die Bilder hervorheben möchten und gleichzeitig Variantenwahl und Kaufbuttons leicht zugänglich halten wollen. Dieses Layout ist verfügbar in: * ✅ Plain Jane v3+ * ✅ Plain Jane Interactive v2+ *** ### 🔧 So aktivieren Sie das Showcase-Layout 1. Gehen Sie zu **Onlineshop > Themes > Anpassen** 2. Verwenden Sie das obere Dropdown-Menü, um auszuwählen **Produkte > Standardprodukt** 3. Klicken Sie in der linken Seitenleiste **Abschnitt hinzufügen > Produktabschnitt \[Showcase]** 4. Blenden Sie alle anderen Produkt-Layout-Abschnitte aus (wie `Produktabschnitt` oder `Produktabschnitt [Scroll]`) 5. Klicken Sie in den Abschnitt, um Ihr Layout zu konfigurieren > 💡 Tipp: Sie können diesen Abschnitt zur einfacheren Navigation über das „...“-Menü neben dem Abschnittstitel umbenennen. *** ### ⚙️ Layout- & Anzeigeeinstellungen Zu finden in der rechten Seitenleiste, nachdem Sie den `Produktabschnitt [Showcase] ausgewählt haben` Abschnitt. #### Layout Desktop * Wählen Sie aus mehreren Layoutstilen zur Anordnung von Galerie und Produktinfo * `Galerie zentriert – Varianten rechts` *(Standard)* #### Ausrichtung der Produktinfo auf Mobilgeräten * Text der Produktinformationen auf Mobilgeräten ausrichten zu `Links`, `Zentriert`, oder `Rechts` #### Beschreibung unter Buttons verschieben (Mobil) * Schalten Sie ein, um Beschreibungen und Akkordeons zu platzieren *unterhalb* des „In den Warenkorb“-Buttons *** ### 📊 Mobiler Bildlauf-Fortschrittsbalken Fügen Sie der mobilen Bildergalerie einen Scroll-Indikator hinzu: * **Farbverlauf der Spur** – Hintergrundleiste (Verlauf oder einfarbig) * **Indicator-Farbe** – Vordergrund-Scroll-Indikator *** ### 🔍 Zoom-Button (Mobil) * Umschalten, um das Bild-Zoom-Symbol auf Mobilgeräten ein-/auszublenden * Schaltflächenfarbe anpassen (`Farbe des Zoom-Buttons (Mobil)`) *** ### 🧾 Zusätzliche Info-Popup Diese Einstellung steuert das **Popup-Akkordeon** wenn Sie es für Dinge wie verwenden: * Größentabellen * Rückgaberichtlinien Anpassen: * Popup-Hintergrundfarbe * Verlaufsüberlagerungen * Transparenz-/Deckkraft-Einstellungen *** ### 🧪 Profi-Tipps * Verwenden Sie hochauflösende, quadratische oder hochformatige Produktbilder für die beste Wirkung * Fügen Sie Produkt-Akkordeons für ergänzende Infos wie Versand, Pflege oder Materialien hinzu * Dieses Layout passt gut zu minimalistischen Schriftarten und dezenten Theme-Farben > ⚠️ Warnung: Dieses Layout unterstützt keine Bild-Thumbnails oder Bild-Scrollen. Verwenden Sie `Thumbnail` oder `Scroll` Layouts, wenn Sie diese Funktionen benötigen. ### **Brauchen Sie Hilfe?** * 💬 **Treten Sie unserer Community auf Discord bei:** * 📧 **Schreiben Sie uns eine E-Mail an:** * 💻 **Chatten Sie live mit uns:** Verfügbar Montag–Freitag, 10:00–18:00 EST, direkt auf unserer Website --- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://docs.openspaces.design/german/plain-jane-interactive/pages-and-menus/product-page/product-section-showcase.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.