Remarque : même si nos guides les plus populaires ont été traduits en français, certains guides sont uniquement disponibles en anglais.

Blocs Produit

Un bloc Produit affiche un article de la boutique de votre site sur d'autres pages ou billets. C'est un excellent moyen de promouvoir des produits sur votre site ou de créer une disposition différente de la page de destination intégrée de votre boutique.

Conseil : Pour en savoir plus sur les différences entre les pages de Boutique et les blocs Produits, consultez les pages Boutique et les blocs Produits.

Avant de commencer

  • Pour utiliser les blocs Produit, vous devez disposer d’une page Boutique contenant le produit que vous souhaitez afficher.
  • La page Boutique contenant le produit doit être activée. Si vous la désactivez, le produit n’apparaîtra pas dans les paniers s’il est ajouté via les blocs Produit.
  • The product must be published and visible.

Ajouter le bloc Produit

Pour ajouter un bloc Produit :

  1. Modifiez une page ou une publication, cliquez sur un point d’insertion, puis sélectionnez Produit dans le menu. Pour en savoir plus, consultez l’article Ajouter des contenus à l’aide de blocs.
  2. Dans le champ Ajouter un produit, cherchez le produit que vous souhaitez afficher. Cliquez dessus dans les résultats de la recherche pour l'ajouter. La recherche affiche jusqu'à 15 produits.
  3. Pour accéder à votre inventaire et apporter des modifications aux produits, cliquez sur Edit products (Modifier les produits), puis cliquez sur Save and Continue (Enregistrer et continuer). Gardez à l'esprit que cela ferme la page en cours.
  4. Cliquez sur l'onglet Design pour personnaliser les détails à afficher sur le produit.
Astuce : les blocs Produit affichent un produit à la fois. Pour afficher plusieurs produits sur une page, utilisez plusieurs blocs Produit ou affichez une collection de produits à l’aide de blocs Sommaire.

Promouvoir des produits protégés

Si vous disposez d’un abonnement au service Espaces membres et que vous configurez une boutique en ligne dans l’un de vos espaces membres, les visiteurs du site devront souscrire un abonnement avant de pouvoir acheter des produits dans cette boutique protégée. Pour permettre aux visiteurs qui ne sont pas membres d’acheter ces produits, ajoutez des blocs Produit sur votre site principal et utilisez la barre de recherche Ajouter un produit pour sélectionner des produits de votre boutique protégée.

Add product details

Pour personnaliser le bloc Produit, cliquez sur l'onglet Design. Ici, vous pouvez définir l'alignement du bloc à gauche, au centre ou à droite. Vous pouvez également personnaliser les détails à afficher sur le produit en activant ou en désactivant les curseurs :

  • Image - Affiche l'image miniature du produit
  • Titre - Affiche le titre du produit
  • Prix - Affiche le prix du produit
  • Description - Affiche la description du produit
  • Bouton Ajouter au panier - Affiche un bouton Ajouter au panier
  • Vue rapide du produit - Permet un aperçu rapide

To change any of these details, edit the product.

Personnaliser le bloc Produit

Vous pouvez personnaliser le bloc Produit et le bouton Ajouter au panier.

Texte des boutons

Par défaut, le texte du bouton du bloc Produit est Ajouter au panier. Vous pouvez modifier ce texte par Acheter maintenant par exemple.

  1. Ouvrez la page Boutique contenant le produit affiché dans votre bloc Produit.
  2. Double-click the product to open the product editor.
  3. Dans l'onglet Options, saisissez le nouveau texte du bouton.

Design du bouton

La méthode pour modifier le design du bouton dépend de la version de votre site.

  1. Ouvrez une page contenant un bloc Produit.
  2. Cliquez sur Modifier, ouvrez le panneau Styles du site, puis cliquez sur Boutons.

Pour en savoir plus, consultez l’article Personnaliser les boutons.

  1. Ouvrez une page contenant un bloc Produit.
  2. Dans le Menu principal, cliquez sur Design, puis sur Styles du site.
  3. Scroll down to the style tweaks for buttons.

Pour en savoir plus, consultez l’article Personnaliser les boutons.

Texte et police du bloc Produit

La marche à suivre pour personnaliser le style du titre, du prix et de la description du bloc Produit dépend de la version de votre site

Pour modifier le texte qui sʼaffiche, accédez à votre page Boutique et modifiez les informations du produit.

Modifiez la police, la couleur du texte et la taille du texte dans le panneau Styles du site

  • Police : suit Paragraphes
  • Couleur : suit Paragraphe (moyen)
  • Taille : suit Paragraphe 2

Le titre apparaît toujours légèrement plus grand.

Pour modifier le texte qui sʼaffiche, accédez à votre page Boutique et modifiez les informations du produit.

The product details fonts take their style from other text styles on your site. In most templates:

  • Titre - Reprend la police du corps du texte, mais légèrement plus grande. La couleur reprend celle du lien dans le corps de texte.
  • Pricing - Follows the body text font and color, but slightly larger.
  • Description - Follows the body text font and color.

There are some exceptions. In these template families:

Famille de templates Remarques

Bedford

  • Title color - Follows body text

Brine

  • Title color - Follows body text

Farro

  • Title color - Follows body text

Skye

  • Police du titre -Titre de liste (ajuster sur une page Blog)
  • Description font - Excerpt
  • Title color - Title Color
  • Description Color - Excerpt Color
Supply
  • Price font - no style options
  • Description - Fixed weight

Taille et forme du bloc Produit

Lorsque vous ajoutez le bloc pour la première fois, il couvre toute la largeur de la zone de contenu s’il n’y a pas d’autres blocs à côté. Pour obtenir de l’aide sur le redimensionnement des blocs, consultez les articles Redimensionner des blocs et Déplacer des blocs pour personnaliser les dispositions.

Pour la forme du bloc, la valeur de proportion des blocs Produit correspond à la valeur de proportion originale de lʼimage miniature du produit. Pour vous assurer quʼun bloc Produit utilise une valeur de proportion spécifique, recadrez lʼimage avant de la charger dans lʼéditeur de produit ou utilisez lʼéditeur dʼimage dans lʼéditeur de produit.

Conseils de recherche de blocs de produits

When searching for a product to display in the block, the search results are based on the following information:

  • Titres
  • Descriptions
  • Tags
  • Catégories
  • Blocs Texte dans les informations supplémentaires sur le produit

La recherche affiche jusquʼà 15 correspondances. Si vos produits ont des noms similaires, effectuez une recherche par titre exact. Il est possible que les nouveaux produits ne sʼaffichent pas immédiatement dans la recherche.

Personnaliser votre boutique en ligne

Bien que vous devez utiliser une page Boutique pour ajouter des produits à votre site, vous pouvez utiliser des blocs Produits pour créer une disposition personnalisée de la boutique en ligne sur une autre page. Une fois que vous avez créé et personnalisé votre boutique, vous pouvez masquer la page Boutique en la déplaçant vers la section Non liée du panneau Pages. Cela supprime la page Boutique des menus de navigation tout en la laissant activée.

Dépannage

Mon bloc Produit nʼaffiche pas la bonne image

Les blocs Produits affichent l'image miniature du produit. Cette image peut être différente de la première image définie dans l'éditeur de produit. Pour modifier l'image dans le bloc Produit, modifiez l'image miniature du produit.

Le produit ne peut être ajouté au panier à partir du bloc Produit

Si le fait de cliquer sur le bouton Ajouter au panier d’un bloc Produit n’ajoute pas le produit au panier, la page Boutique associée peut être désactivée. Les produits des pages Boutique désactivées peuvent s’afficher dans les blocs Produit, mais ne peuvent pas être ajoutés aux paniers. Pour résoudre ce problème, activez la page Boutique.

Cet article vous a-t-il été utile ?
Utilisateurs qui ont trouvé cela utile : 53 sur 177