Documentation SeedProd

Documentation, matériel de référence et tutoriels pour SeedProd

Bloc d'informations complémentaires (WooCommerce)

Le bloc Informations supplémentaires vous permet d'afficher les données relatives aux attributs des produits WooCommerce dans vos modèles de produits uniques. Ce bloc extrait et affiche automatiquement les informations de la section Attributs supplémentaires de chaque produit, présentant les spécifications telles que les dimensions, le poids, la couleur, le matériau et d'autres attributs personnalisés dans un tableau organisé.

Ce bloc est essentiel pour les modèles de produit unique lorsque vous souhaitez présenter les spécifications et les attributs détaillés d'un produit dans une mise en page claire et professionnelle. Il aide les clients à prendre des décisions d'achat éclairées en leur fournissant tous les détails techniques et les spécifications dont ils ont besoin en un coup d'œil.

Conditions requises :le bloc « Informations supplémentaires » est disponible dans notreoffre de licence Elite.

Bloc d'informations supplémentaires affichant les attributs du produit

Ajouter le bloc d'informations supplémentaires à vos pages

Suivez ces étapes pour ajouter un bloc d'informations supplémentaires à 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 Informations supplémentaires dans la section souhaitée de votre modèle de produit unique.

Faire glisser le bloc Informations supplémentaires vers la page

Le bloc Informations supplémentaires se trouve sous Balises de modèle WooCommerce et peut être ajouté à votre modèle de produit unique.

Étape 2 : Configurer les paramètres de contenu

Une fois ajouté, cliquez sur le bloc Informations supplémentaires pour ouvrir ses paramètres. Dans l'onglet Contenu, vous pouvez personnaliser l'affichage des attributs du produit.

  • En-tête : saisissez ou modifiez le texte de l'en-tête qui apparaît au-dessus du tableau des attributs du produit (par exemple, « Informations supplémentaires » ou « Spécifications du produit »).
  • Typographie de l'en-tête : personnalisez les propriétés de police pour l'en-tête de section, notamment la famille, la taille, l'épaisseur et le style de police.
  • Couleur de l'en-tête : définissez la couleur du texte de l'en-tête en fonction de votre design.
  • Typographie : contrôlez les propriétés des polices pour les étiquettes et les valeurs des attributs dans le tableau, notamment la famille, la taille, le poids et le style des polices.
  • Couleur du texte : choisissez la couleur du texte de l'attribut afin d'assurer une bonne lisibilité.
Paramètres de contenu des informations supplémentaires

L'onglet Contenu vous permet de personnaliser le texte de l'en-tête, la typographie et les couleurs pour l'affichage des attributs du produit.

Étape 3 : Personnalisez le design

Dans l'onglet Avancé, vous pouvez personnaliser l'apparence visuelle de votre bloc Informations supplémentaires :

Espacement :

  • Marge : contrôlez l'espacement extérieur autour de votre bloc Informations supplémentaires (haut, droite, bas, gauche). Cela détermine l'espace qui apparaîtra entre le bloc et les éléments environnants.
  • Remplissage : ajustez l'espacement intérieur dans votre bloc Informations supplémentaires (haut, droite, bas, gauche). Cela crée un espace entre le contenu et les bords du bloc.

Attributs :

  • Identifiant CSS : affiche l'identifiant unique généré automatiquement pour votre bloc d'informations supplémentaires. Cet identifiant est créé automatiquement par SeedProd pour le personnalisation du style ou le ciblage JavaScript.
  • Classe personnalisée : ajoutez des classes CSS personnalisées pour appliquer des styles spécifiques à partir de votre thème ou de votre CSS personnalisé.
  • Attributs personnalisés : ajoutez n'importe quel attribut HTML à l'élément conteneur du bloc. Entrez chaque attribut sur une nouvelle ligne en utilisant le format : nom-de-l'attribut|valeur (par exemple, data-product-info|attributes)

Visibilité des appareils :

  • Masquer sur le bureau : masquer le bloc d'informations supplémentaires sur les écrans de bureau.
  • Masquer sur tablette : masquer le bloc Informations supplémentaires sur les tablettes.
  • Masquer sur mobile : masquer le bloc d'informations supplémentaires sur les appareils mobiles.

Effets d'animation :

  • Animation d'entrée : choisissez parmi divers effets d'animation qui s'affichent lorsque le bloc d'informations supplémentaires apparaît à l'écran. Les options disponibles incluent Rebond, Fondu entrant, Zoom avant, Rotation et bien d'autres encore. Cela permet d'attirer l'attention sur les spécifications de votre produit.
Informations supplémentaires Paramètres avancés

L'onglet Avancé propose des options pour l'espacement, les attributs personnalisés, la visibilité des appareils et les animations d'entrée.

Étape 4 : Enregistrez vos modifications

Une fois que vous avez terminé de configurer le bloc Informations supplémentaires et de personnaliser son apparence, veillez à enregistrer votre travail.


Vous avez ajouté avec succès un bloc « Informations supplémentaires » à votre modèle de produit unique ! Ce bloc affiche automatiquement les attributs et les spécifications du produit dans un tableau clair et organisé, aidant ainsi les clients à prendre des décisions d'achat éclairées. Testez différents paramètres de typographie et de couleur pour créer un affichage des informations produit qui correspond à votre marque et met en valeur vos pages produit.

Articles connexes