3. Création et personnalisation de votre page Collections

Pour Plain Jane et Interactive

Ce que vous apprendrez

  • Comment créer et organiser des collections dans Shopify

  • Comment créer et attribuer des menus aux pages de collection

  • Comment utiliser et personnaliser la « Collection Classique » et la « Collection avec barre latérale » dans les thèmes Plain Jane v3 et Interactive v2

  • Comment modifier les paramètres de conception tels que les espacements, polices, couleurs et options d'affichage des produits

🛠️ Premiers pas : configuration de base de Shopify

Cette section est destinée aux débutants qui configurent leur boutique pour la première fois.

1. Créer des collections de produits

  1. Allez dans votre Admin Shopify > Produits > Collections.

  2. Cliquer sur Créer une collection.

  3. Nommez votre collection (par ex., Hauts, Bas, Accessoires).

  4. Définissez le type sur Manuel.

    ⚠️ Les collections manuelles vous permettent de contrôler l'ordre des produits manuellement.

  5. Cliquer sur Enregistrer, puis utilisez le Parcourir bouton pour ajouter des produits.

Répétez pour chaque catégorie.

2. Créer un menu pour la barre latérale de votre collection

  1. Aller à Boutique en ligne > Navigation.

  2. Cliquer sur Ajouter un menu.

  3. Nommez-le quelque chose comme Menu Boutique.

  4. Ajoutez des liens tels que :

    • Hauts → Lien vers votre Hauts collection

    • Bas → Lien vers votre Bas collection

    • Vêtements d'extérieur, Chaussures, etc.

  5. Vous pouvez faire glisser des éléments pour les imbriquer (par ex., Shorts sous Bas).

  6. Cliquer sur Enregistrer le menu.


🎨 Personnalisation du thème : pages de collection

Ces instructions s'appliquent à la fois à Plain Jane v3 et Interactive v2 thèmes.

  1. Accédez à Boutique en ligne > Thèmes > Personnaliser

  2. Utilisez le sélecteur de page déroulant pour passer à Collections modèle

Section Collection Classique

  1. Aller à Boutique en ligne > Thèmes > Personnaliser.

  2. Depuis le panneau de gauche, sélectionnez la Page de collection modèle.

  3. Recherchez une section intitulée Collection Classique.

Paramètres clés :

  • Sélectionner le menu : Assignez le Menu Boutique personnalisé que vous avez créé.

  • Position du menu : Choisissez Gauche ou Droite.

  • Alignement du texte : Options pour Gauche, Centre, ou Droite.

  • Taille de police et espacements : Ajustez les espacements du menu et des liens.

  • Couleurs du menu : Personnalisez les couleurs de fond et de texte.

  • Afficher titres/prix des produits : Activez ou désactivez la visibilité et ajustez la taille et la couleur de la police.

  • Cadres des produits : Ajoutez des bordures et des effets au survol.

  • Rayon d'arrière-plan du produit : Ajustez les coins de carrés à arrondis.

  • Rendre l'arrière-plan transparent : Fonctionne mieux avec des PNGs transparents.

Options de recherche et de tri

  • Position : Aligner les icônes Gauche, Centre, ou Droite.

  • Couleurs : Personnalisez les couleurs des icônes et du menu déroulant.

  • Paramètres de superposition de recherche:

    • Ajuster opacité de l'arrière-plan

    • Définir couleur de fond de la zone de recherche

  • Menu de tri : Choisissez comment les produits sont triés : En vedette, Les plus récents, Prix, etc.

Étiquettes de promotion

  • Afficher les étiquettes de réduction comme « En solde »

  • Personnaliser la couleur du texte de l'étiquette taille de la police, couleur de fond, et téléchargement de produits avec PNGs

💡 Astuce : Utilisez des PNGs transparents si vous souhaitez contrôler les couleurs d'arrière-plan à l'aide de l'éditeur de thème.

🧭 Collection avec barre latérale (optionnelle)


Vous voulez une mise en page plus traditionnelle ? Utilisez plutôt la Collection avec barre latérale.

Dans le même

  1. modèle, Page de collection masquez la section. Collection Classique Activez plutôt la Collection avec barre latérale

  2. Paramètres de la collection avec barre latérale : Attribuez un

Menu

  • Position de la barre latérale : Télécharger l'arrière-plan de la barre latérale

  • (appelé un « skin ») Gauche ou Droite

  • ombres défilement fixe

  • Ajuster opacité, comportement, et 💡 Astuce : Les barres latérales fixes restent visibles lors du défilement. Tous les autres paramètres d'affichage comme les infos produit, les étiquettes et les icônes de recherche/tri fonctionnent de la même manière que dans la section Collection Classique.

✅ Remarques finales

dans l'éditeur de thème après avoir effectué des modifications.


Si les modifications n'apparaissent pas immédiatement, essayez d'actualiser la page.

  • Cliquez toujours Enregistrer Gardez des tailles d'images produits cohérentes (par ex., 1000x1000px) pour des mises en page alignées.

  • Si les modifications n'apparaissent pas immédiatement, essayez d'actualiser la page.

  • Conservez des tailles d'images produits cohérentes (par ex., 1000x1000 px) pour des mises en page alignées.

Besoin d’aide ?

Mis à jour