# Seite mit Kollektionenliste

> **Was Sie lernen werden**
>
> * Wie Sie Ihre Seite mit der Sammlungsliste einrichten und gestalten
> * Wie Sie 3D-Sammlungskarten anpassen
> * Wo Sammlungen, Bilder und visuelle Effekte zugewiesen werden

***

### 🧭 Wo Sie es finden

Im Shopify Theme-Editor:

1. Gehen Sie zu **Online-Shop > Designs**
2. Klicken Sie **Passen Sie** in Ihrem aktiven Theme
3. Verwenden Sie das obere Dropdown-Menü, um zu navigieren zu `Sammlungsliste`

***

### 🗂 Abschnittsübersicht

Die Seite mit der Sammlungsliste ist ein stilisiertes Raster ausgewählter Sammlungen mit vollständig anpassbaren **3D-Sammlungskarten**. Jede Karte kann mit einer bestimmten Sammlung verlinken und auf Maus-Hover mit visuellen Effekten und Textüberlagerungen reagieren.

#### 🧱 Sammelkarte-Blöcke

Jede Karte ermöglicht Ihnen:

* Eine bestimmte **Sammlung** auszuwählen, um anzuzeigen
* Zuweisen **Desktop-** und **mobile Vorschaubilder**
* Steuern **Hover-Effekte** und Text **Ausrichtung**
* Passe **Farben**, **Schatten**, **Abstand**, und **Hover-Animation**

***

🖼️ Einstellen des Vorschaubilds

> ⚠️ Vorschaubilder für Sammlungskarten werden direkt aus der Sammlungskonfiguration im Shopify-Admin gezogen.

1. Gehen Sie zu **Shopify Admin > Produkte > Sammlungen**
2. Klicken Sie auf die Sammlung, die Sie verwenden möchten
3. Laden Sie ein Vorschaubild hoch
4. Kehren Sie zum Theme-Editor zurück, um die Karte weiter zu gestalten

***

### 🎛 Wichtige Einstellungen (pro Sammlungskarte)

#### ✅ Sichtbarkeitsumschalter

* `Sammlungsbild anzeigen`
* `Überschrift anzeigen`
* `Beschreibung anzeigen`
* Umschalten von hover-spezifischen Inhalten (Bild, Überschrift, Beschreibung)

#### 🌀 Karten-Effekte (nur Desktop)

* `Tilt aktivieren`
* `Tilt-Glanz aktivieren`

> 💡 Effekte werden nur auf der **Live-Seite**angezeigt, nicht in der Vorschau des Theme-Editors.

#### 🎨 Farben

* Hintergrundfarbe
* Hover-Hintergrundfarbe
* Überschrift- und Beschriftungsfarben (Standard und Hover)

#### 🎯 Ausrichtung und Position

Passe **header** und **Beschreibung** Ausrichtung und pixelgenaue Positionierung mittels:

* `Oben/Unten` und `Links/Rechts` Schieberegler
* Separate Optionen für **Standard** und **Hover** Zustände

***

### 📐 Kartendesign-Einstellungen

* **Kartenradius**: Rundet die Ecken der Karte (z. B., `30px`)
* **Benutzerdefinierter Hover-Titel & Beschreibung**: Optionale Textüberlagerung beim Hover
* **Kartenhintergrund beim Hover**: Alternatives Hintergrundbild hochladen
* **Verlaufüberlagerungen**: Oben/unten Verläufe beim Hover mit Farbe + Deckkraft hinzufügen

***

### 📏 Bildgrößen

* **Abmessungen der Desktop-Karte**: `740px x 350px`
* **Abmessungen der Mobilkarte**: `315px x 350px`

> ⚠️ Stellen Sie sicher, dass alle Ihre Sammlungskarten konsistente Bildgrößen verwenden, damit das Layout sauber bleibt

***

### 🎵 Bonus-Tipp

Wenn Sie den **Musikplayer** Abschnitt mit Sammlungsliste verwenden, denken Sie daran:

> ⚠️ Der Musikspieler **funktioniert nur mit direkten `.mp3` Datei-URLs.** Links zu Streaming-Plattformen (z. B. Spotify, Apple Music) funktionieren nicht.

***

### **Brauchen Sie Hilfe?**

* 💬 **Treten Sie unserer Community auf Discord bei:** <https://discord.gg/hcc2GvgZc6>
* 📧 **Schreiben Sie uns eine E-Mail an:** <support@openspaces.design>
* 💻 **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-list-page.md?ask=<question>
```

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.
