# Kategorieseite > **Was Sie lernen werden** > > * Der Unterschied zwischen Classic- und Sidebar-Collection-Layouts > * Wie man ein benutzerdefiniertes Menü mit seinen Kategorieseiten verbindet > * Tipps zur Anzeige von Produkten und zur Anpassung der Designeinstellungen *** ### 🧱 Optionen für Collection-Layouts Plain Jane enthält **zwei Layouttypen** für Kategorieseiten: | Layout-Typ | Beschreibung | | ---------------------------- | ------------------------------------------------------------------------------------ | | **Classic Collection** | Minimales Design mit festem Kategorienmenü und Sortier-/Suchsymbolen | | **Seitenleisten-Kollektion** | Enthält eine anpassbare Seitenleiste mit erweiterten Layout- und Hintergrundoptionen | Sie können zwischen diesen Layouts wechseln, indem Sie die Aktivierung/Deaktivierung des `Classic Collection` oder `Seitenleisten-Kollektion` Abschnitts im **Theme-Editor**. > 💡 Tipp: Verwenden Sie immer nur einen Collection-Abschnitt gleichzeitig (den anderen ausblenden). *** ### 🔗 Verbinde ein benutzerdefiniertes Collection-Menü Um ein benutzerdefiniertes Navigationsmenü für Ihre Kategorieseite zu erstellen: 1. Gehen Sie zu **Onlineshop > Navigation** im Shopify-Admin 2. Klicken Sie **Menü hinzufügen** und benennen Sie es (z. B. `Shop-Menü`) 3. Fügen Sie Links für Ihre Kategorien hinzu (z. B. Tops, Hosen, Accessoires) 4. (Optional) Elemente für zweite/dritte Ebenen verschachteln 5. Klicken Sie **Speichern** Dann: 1. Öffnen Sie die **Theme-Editor** 2. Wählen Sie **Collections > \[Ihre Collection]** aus dem oberen Dropdown 3. Klicken Sie auf `Classic Collection` oder `Seitenleisten-Kollektion` 4. Unter **Collection-Menü auswählen**, wählen Sie das gerade erstellte Menü aus *** ### ⚙️ Wichtige Layout-Einstellungen #### 🧭 Menü-Einstellungen * **Position**: Links oder rechts * **Textausrichtung**: Links, zentriert oder rechts * **Schriftgröße und Abstand**: Passen Sie den Abstand für oberste und verschachtelte Menül i nks an #### 🎨 Stil-Einstellungen * **Menüfarben**: Passen Sie Link-, Hover- und Hintergrundfarben an * **Produkttitel & Preise**: Anzeigen/ausblenden, Größe anpassen und Farben ändern * **Produktetiketten**: Aktivieren Sie "Im Angebot"-Markierungen mit benutzerdefinierten Farben und Größen > 💡 Tipp: Verwenden Sie konsistente Bildabmessungen (z. B. 1000x1000px), um Produktraster auszurichten. *** ### 🖼 Produktbild-Styling * **Produktrahmen**: Fügen Sie eine Hover-Umrandung mit anpassbarer Farbe und Dicke hinzu * **Bild-Ecken**: Passen Sie den Hintergrundradius für scharfe oder abgerundete Kanten an * **Hintergrundfarbe**: Funktioniert nur, wenn Bilder transparent hochgeladen wurden `.png` ``` Um benutzerdefinierte Hintergrundfarben zu aktivieren: - Verwenden Sie transparente PNGs - Schalten Sie "Hintergrund transparent machen" aus ``` *** ### 🔍 Such- und Sortiersteuerung * **Symbolposition**: Links, zentriert oder rechts * **Sichtbarkeit umschalten**: Blenden Sie Symbole einzeln aus oder ein * **Farbeinstellungen**: Passen Sie Symbol- und Hintergrundfarben an * **Suchleisten-Overlay**: Passen Sie Deckkraft und Hintergrundfarbe an Wenn Kunden auf das Filter- oder Sortiersymbol klicken: * Das Filtersymbol öffnet ein verschiebbares Such-Overlay * Das Sortiersymbol lässt Kunden nach Preis, Neuheiten, A–Z oder Empfohlen sortieren *** ### 🧰 Extras für Sidebar-Collections (nur Sidebar-Layout) * **Seitenleisten-Skin hochladen**: Fügen Sie ein Hintergrundbild oder Muster hinzu * **Seitenleisten-Deckkraft**: Steuern Sie die Transparenz der Seitenleiste * **Sticky-Seitenleiste**: Aktivieren Sie feste Position beim Scrollen * **Seitenleisten-Schatten**: Fügt eine subtile Kanten-Schatten für Tiefe hinzu *** ### 🛠 Manuelle Produkt-Sortierung > ⚠️ Wichtig: Um die Produktreihenfolge in einer Kollektion zu steuern, setzen Sie den Sortiertyp auf **Manuell**. Schritte: 1. Gehen Sie zu **Produkte > Kollektionen** im Shopify-Admin 2. Wählen Sie Ihre Kollektion und klicken Sie **Sortieren > Manuell** 3. Ziehen und ordnen Sie Produkte nach Bedarf neu Diese Reihenfolge wird auf der Kategorieseite im Frontend angezeigt. *** ### 📌 Hinweise zu Produktbildern * Fehlplatzierte Produkttitel/-preise werden meist durch inkonsistente Bildgrößen verursacht * Verwenden Sie gleichmäßige quadratische Bilder (z. B. 1000x1000) für die beste visuelle Ausrichtung *** ### **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/pages-and-menus/collection-page.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.