# Einstellungen für die Kollektionen-Ansicht > **Was Sie lernen werden** > > * So passen Sie das Layout Ihrer Kategorieseiten an > * So passen Sie Spaltenanzahl, Abstände, Bildgröße und Hover-Effekte an *** ### 🧭 Überblick Die **Kategorieseiten-Layout** Einstellungen ermöglichen Ihnen zu steuern, wie Produkte auf Ihren Kategorieseiten auf Desktop und Mobil angezeigt werden. Diese Optionen helfen dabei, das ideale Einkaufserlebnis zu schaffen, das zum Erscheinungsbild Ihrer Marke und Ihrem Produktsortiment passt. *** ### 🖥️ Layout-Optionen #### Desktop-Spalten * Wählen Sie, wie viele Produkte pro Zeile auf dem Desktop angezeigt werden: * Optionen: **2**, **3**, **4**, **5**, oder **6** Spalten #### Mobile-Spalten * Wählen Sie, wie viele Produkte pro Zeile auf Mobilgeräten angezeigt werden: * Optionen: **Eine** oder **Zwei** Spalten > 💡 Verwenden Sie weniger Spalten für große Produktbilder oder Premium-Artikel #### Spalten- & Zeilenabstände Passen Sie den Abstand zwischen Produkten an, um die visuelle Dichte zu steuern: * **Spaltenabstand (Desktop)** * **Zeilenabstand (Desktop)** * **Spaltenabstand (Mobil)** * **Zeilenabstand (Mobil)** Alle Werte werden in Pixeln gemessen (`px`) und sind über einen Schieberegler einstellbar. *** ### 🖼️ Bildeinstellungen #### Produktbildgröße * Passen Sie die prozentuale Größe des Produktbilds relativ zu seinem Container an (z. B. 100%) #### Seitenverhältnis des Produktbilds Wählen Sie, wie Produktbilder in Ihrem Raster geformt werden sollen: * **Natürlich (originale Bildgröße)** * **Quadratisch** * **Hochformat** * **Querformat** > 💡 Wählen Sie **Quadratisch** für ein gleichmäßigeres Layout #### Zweites Produktbild beim Hover anzeigen * Schalten Sie dies ein, um beim Hover auf dem Desktop das zweite Bild in einer Produktauflistung anzuzeigen * Wird häufig verwendet, um alternative Ansichten oder Produktwinkel zu zeigen *** ### 🧪 Übliche Anwendungsfälle * **Minimalistische Shops** — Verwenden Sie 2–3 Spalten und größere Abstände * **Hochvolumige Shops** — Verwenden Sie 4–6 Spalten, um mehr Produkte anzuzeigen * **Interaktive Präsentationen** — Aktivieren Sie das zweite Bild beim Hover für mehr Produktinteraktion *** ### **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/readme-1/theme-settings/collection-layout-settings.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.