Seite mit Kollektionenliste

Für Plain Jane und Plain Jane Interactive

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-Seiteangezeigt, 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: [email protected]

• 💻 Chatten Sie live mit uns: Verfügbar Montag–Freitag, 10:00–18:00 EST, direkt auf unserer Website