# Page de liste de collections

> **Ce que vous apprendrez**
>
> * Comment configurer et styliser votre page Liste de collections
> * Comment personnaliser les cartes de collection 3D
> * Où attribuer les collections, les images et les effets visuels

***

### 🧭 Où le trouver

Dans l'éditeur de thème Shopify :

1. Aller à **Boutique en ligne > Thèmes**
2. Cliquer sur **Personnaliser** sur votre thème actif
3. Utilisez le menu déroulant en haut pour naviguer vers `Liste de collections`

***

### 🗂 Aperçu de la section

La page Liste de collections est une grille stylisée de collections sélectionnées utilisant des **Cartes de collection 3D**. Chaque carte peut être liée à une collection spécifique et réagir au survol de la souris avec des effets visuels et des superpositions de texte.

#### 🧱 Blocs de carte de collection

Chaque carte vous permet de :

* Sélectionner une **collection** à afficher
* Attribuer **images vedettes** et **pour le bureau et le mobile**
* Contrôler **les effets au survol** et l' **alignement du texte**
* Ajuster **couleurs**, **comportement**, **l'espacement**, et **l'animation au survol**

***

🖼️ Définir l'image mise en avant

> ⚠️ Les images mises en avant pour les cartes de collection sont récupérées directement depuis la configuration de la collection dans l'administration Shopify.

1. Aller à **Administration Shopify > Produits > Collections**
2. Cliquez sur la collection que vous souhaitez utiliser
3. Téléchargez une image mise en avant
4. Retournez dans l'éditeur de thème pour continuer à styliser la carte

***

### 🎛 Paramètres clés (par carte de collection)

#### ✅ Commutateurs de visibilité

* `Afficher l'image de la collection`
* `Afficher l'en-tête`
* `Afficher la description`
* Activer/désactiver le contenu spécifique au survol (Image, En-tête, Description)

#### 🌀 Effets de carte (bureau uniquement)

* `Activer l'inclinaison`
* `Activer l'éblouissement d'inclinaison`

> 💡 Les effets s'affichent uniquement sur le **site en ligne**, pas dans l'aperçu de l'éditeur de thème.

#### 🎨 Couleurs

* Couleur d'arrière-plan
* Couleur d'arrière-plan au survol
* Couleurs de l'en-tête et de la description (par défaut et au survol)

#### 🎯 Alignement et position

Ajuster **en-tête** et **description** alignement et positionnement en pixels à l'aide de :

* `curseurs Haut/Bas` et `Gauche/Droite` curseurs
* Options séparées pour **par défaut** et **survol** états

***

### 📐 Paramètres de conception de la carte

* **Courbure de la carte** : Arrondit les coins de la carte (par ex., `30px`)
* **Titre et description personnalisés au survol** : Superposition de texte optionnelle au survol
* **Arrière-plan de la carte au survol** : Téléchargez une image d'arrière-plan alternative
* **Superpositions en dégradé** : Ajoutez des dégradés haut/bas au survol avec couleur + opacité

***

### 📏 Taille des images

* **Dimensions de la carte sur bureau**: `740px x 350px`
* **Dimensions de la carte sur mobile**: `315px x 350px`

> ⚠️ Assurez-vous que toutes vos cartes de collection utilisent des tailles d'image cohérentes pour une mise en page propre

***

### 🎵 Astuce bonus

Si vous utilisez la **Lecteur de musique** section avec la Liste de collections, souvenez-vous :

> ⚠️ Le lecteur de musique **ne fonctionne qu'avec des `.mp3` URL de fichier directes.** Les liens vers des plateformes de streaming (par ex., Spotify, Apple Music) ne fonctionneront pas.

***

### **Besoin d’aide ?**

* 💬 **Rejoignez notre communauté sur Discord :** <https://discord.gg/hcc2GvgZc6>
* 📧 **Envoyez-nous un e-mail à :** <support@openspaces.design>
* 💻 **Discutez en direct avec nous :** Disponible du lundi au vendredi, de 10h à 18h EST, directement sur notre site web