4. Création et personnalisation de votre page Produit

Pour Plain Jane et Interactive

📓 Remarque : Il y a un nouveau modèle de section produit Vitrine disponible qui n’est pas couvert dans cette vidéo. Pour les instructions d’installation et les détails, visitez : Section produit Vitrinearrow-up-right

Ce que vous apprendrez

  • Comment personnaliser la mise en page de la page produit dans Plain Jane v3 et Interactive v2

  • Tous les types de blocs et options de style à l’intérieur de la section produit

  • Comment utiliser la section produit Mise en page Scroll (version archivée)

  • Où ajuster la taille de la galerie, les styles de boutons, les accordéons, et plus

📓 Remarque : La Mise en page Scroll (anciennement appelée Mise en page archivée) est une alternative plus ancienne à la section produit par défaut. Elle est toujours disponible mais ne permet pas de personnalisation par blocs.


🛠️ Accéder à la page produit dans l’éditeur de thème

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

  2. Utilisez le menu déroulant en haut au centre pour sélectionner Produits > Produit par défaut.

  3. Pour prévisualiser un produit différent, cliquez Changer dans la barre de prévisualisation et sélectionnez un autre article.


🧱 Blocs principaux de la section produit

La page produit est composée d’un Section produit et d’un blocs individuels en dessous. Vous pouvez réordonner, supprimer ou personnaliser chacun d’eux.

Blocs courants :

  • Étiquette en promotion: Couleur, rembourrage et espacement personnalisés

  • En-tête: Contrôle l’affichage du titre du produit

  • SKU: Optionnel, affiche le SKU si disponible

  • Prix: Afficher avec ou sans symbole monétaire

  • Description: Prend en charge la limite de mots et le lien « Lire la suite »

  • Galerie: Contrôlée via les paramètres parent de la section produit

  • Boutons: Ajouter au panier et sélecteurs de variantes

  • Accordéons: À utiliser pour les tableaux des tailles, politiques de retour, FAQ, etc.

💡 Astuce : Pour ajouter un bloc, cliquez sur le Section produit, puis Ajouter un bloc.


🎛️ Paramètres de mise en page de la section produit

Cliquez sur le niveau supérieur Section produit pour accéder à ces options de mise en page :

  • Position de l’image: Gauche ou Droite

  • Animation de fondu: Contrôle la façon dont le produit apparaît en fondu

  • Colonnes de la galerie: De 1 à 6 (disponible uniquement si la galerie est à gauche)

  • Dimensionnement de l’image (Bureau & Mobile): Utilisez les curseurs pour ajuster

⚠️ Certains paramètres (comme les colonnes) sont disponibles uniquement lorsque la galerie est à gauche.


🧩 Paramètres supplémentaires du bloc

Étiquette en promotion

  • Modifier la couleur de fond et du texte de l’étiquette

  • Ajuster l’espacement autour du badge

Affichage des prix

  • Basculer le symbole monétaire

  • Ajuster la taille de la police pour les styles luxury/minimal

Bloc Description

  • Définir la couleur, les marges et la limite de mots

  • Active le lien d’extension « Lire la suite »

Boutons et variantes

  • Activer/désactiver le bouton Produit suivant

  • Personnaliser le rayon des coins, les marges, l’espacement

Accordéons

  • Ajouter plusieurs : par ex., Tableau des tailles, Retours/Échanges

  • Personnaliser les titres et l’espacement des marges


🗂️ Section produit Mise en page Scroll (Archivée)

La Mise en page Scroll est une version archivée de la section produit qui affiche une galerie verticale complète.

Comment utiliser :

  1. Cliquer sur Ajouter une section > Section produit Scroll

  2. Masquez la section produit actuelle pour éviter les doublons

  3. Personnalisez en utilisant le panneau de paramètres à droite (cette version n’utilise pas de blocs)

Différences principales :

  • Galerie défilante verticale avec toutes les images empilées

  • Idéal pour le mobile et la narration produit longue

  • Pas de prise en charge des blocs — tous les paramètres sont configurés dans le panneau de section

  • Moins de fonctionnalités de personnalisation (p. ex., pas de coins arrondis)

💡 Astuce : Utilisez ceci si vous préférez l’ancienne expérience de défilement des versions précédentes du thème.


➕ Ajout de sections supplémentaires à la page produit

Vous pouvez ajouter d’autres sections du thème Shopify à la page produit comme sur n’importe quelle autre page :

  • Flux d’images

  • Inscription par e-mail

  • Diaporama

  • Liste de collections

Réorganisez et personnalisez-les pour correspondre au style de votre marque.

Besoin d’aide ?

Mis à jour