Le bloc Contenu produit affiche la description complète du produit pour les produits WooCommerce sur vos modèles de produit unique. Il récupère dynamiquement la description du produit depuis WooCommerce pour chaque produit, de sorte que le contenu correct apparaisse toujours sans aucune mise à jour manuelle.
Ce bloc est conçu exclusivement pour être utilisé sur les modèles de produit unique. Vous pouvez l'utiliser tel quel pour afficher la description du produit exactement telle qu'elle est saisie dans WooCommerce, ou ajouter du texte et une mise en forme supplémentaires autour du shortcode pour personnaliser l'apparence du contenu sur vos pages produit.
Ajout du bloc de contenu produit à vos pages
Suivez ces étapes pour ajouter un bloc de contenu produit à votre modèle de produit unique SeedProd :
Étape 1 : Ajouter le bloc
Sous Design > Blocs > Balises de modèle WooCommerce, faites glisser et déposez le bloc Contenu produit dans la section souhaitée de votre page.
Étape 2 : Configurer les paramètres de contenu
Une fois ajouté, cliquez sur le bloc Contenu produit pour ouvrir ses paramètres. Dans l'onglet Contenu, vous trouverez une zone de texte pré-remplie avec le shortcode SeedProd qui récupère dynamiquement la description du produit WooCommerce.
Texte :
- Champ Contenu : Contient par défaut le shortcode
. Ce shortcode est ce qui récupère dynamiquement la description du produit depuis WooCommerce pour chaque produit — ne le supprimez pas à moins que vous n'ayez l'intention de remplacer entièrement le contenu du produit. Vous pouvez ajouter du texte, du HTML ou une mise en forme supplémentaire au-dessus ou en dessous du shortcode pour compléter la description du produit. - Éditeur visuel / Modifier le HTML : Basculez entre un éditeur visuel en texte enrichi (pour le texte formaté avec des contrôles de barre d'outils) et l'éditeur HTML (pour l'édition directe de code). Les deux modes vous permettent de travailler aux côtés du shortcode dynamique.
- Alignement : Définissez l'alignement horizontal du contenu textuel — Gauche, Centre ou Droite. Prend en charge l'alignement par appareil pour ordinateur, tablette et mobile.
- Taille de la police : Définissez la taille de police de base pour la zone de contenu à l'aide du curseur (10–72px).
Étape 3 : Personnaliser le design
Dans l'onglet Avancé, vous pouvez personnaliser la typographie, la couleur et le style visuel de votre bloc Contenu produit.
Styles :
- Typographie : Définissez la famille de polices, la taille, le poids, la hauteur de ligne, l'espacement des lettres et le style du texte du contenu produit.
- Couleur : Définissez la couleur du texte du contenu de la description du produit.
- Ombre portée du texte : Ajoutez un effet d'ombre au texte — choisissez parmi Aucune, Cheveux fins, Petite, Moyenne, Grande, Très grande ou 2x grande.
- Ombre portée : Ajoutez une ombre portée au bloc entier pour un effet de profondeur subtil.
Espacement :
- Marge : Contrôlez l'espacement extérieur autour de votre bloc de contenu produit (Haut, Droite, Bas, Gauche). Cela détermine l'espace qui apparaît entre la description du produit et les éléments environnants sur la page.
- Rembourrage : Ajustez l'espacement intérieur de votre bloc de contenu produit (Haut, Droite, Bas, Gauche). Cela crée un espace entre le texte de la description et les bords du bloc.
Attributs :
- ID CSS : Affiche l'identifiant unique généré automatiquement pour votre bloc de contenu produit. Cet ID est créé automatiquement par SeedProd pour un style personnalisé ou un ciblage JavaScript.
- Classe personnalisée : Ajoutez des classes CSS personnalisées pour appliquer des styles spécifiques de votre thème ou de votre CSS personnalisé.
- Attributs personnalisés : Ajoutez des attributs HTML à l'élément wrapper du bloc. Entrez chaque attribut sur une nouvelle ligne en utilisant le format : nom-attribut|valeur (par exemple, data-section|description).
Visibilité de l'appareil :
- Masquer sur ordinateur : Masquez le bloc de contenu produit sur les écrans d'ordinateur.
- Masquer sur tablette : Masquez le bloc de contenu produit sur les appareils tablettes.
- Masquer sur mobile : Masquez le bloc de contenu produit sur les appareils mobiles.
Effets d'animation :
- Animation d'entrée : Choisissez parmi divers effets d'animation qui se jouent lorsque le bloc de contenu produit défile dans la vue. Les options incluent Bounce, Fade In, Zoom In, Rotate In, et bien d'autres.
Étape 4 : Enregistrez vos modifications
Une fois que vous avez terminé de configurer le bloc de contenu produit et de personnaliser son apparence, assurez-vous de sauvegarder votre travail.
Vous avez ajouté avec succès un bloc de contenu produit à votre modèle de produit unique ! Le bloc affichera automatiquement la description correcte du produit pour chaque produit, garantissant que vos pages WooCommerce affichent toujours un contenu précis et à jour. Utilisez les contrôles de typographie et d'espacement pour styliser la description afin qu'elle s'intègre parfaitement à la conception de votre page produit.