1. Documentation /
  2. Blocs WooCommerce

Blocs WooCommerce

Imaginez pouvoir créer une page Boutique personnalisée ou une page d’accueil avec une sélection de produits, ou simplement insérer certains blocs de produit dans vos articles et vos pages. Les blocs WooCommerce offrent de nombreuses possibilités. Parcourons les différents blocs inclus par défaut dans l’extension WooCommerce.

Depuis la version 3.6 de WooCommerce, nous incluons par défaut plusieurs blocs très utiles qui permettent d’inclure des produits sur les pages du nouvel éditeur WordPress. Pour plus d’informations sur les blocs et le nouvel éditeur WordPress, consultez la documentation de l’éditeur WordPress (lien disponible uniquement en anglais).

Spécifications minimales

↑ Back to top

Nous vous recommandons de mettre à jour WordPress et WooCommerce vers la dernière version stable. Voici les spécifications minimales :

  • WordPress : version 5.3 ou supérieure.
  • WooCommerce : version 4.2 ou supérieure.

Présenter des produits

↑ Back to top

Plusieurs blocs sont disponibles pour vous aider à présenter vos produits de différentes manières. Comme le suggèrent les noms des blocs, vous pouvez créer des grilles de produits basées sur les étiquettes de produit, les produits mis en avant, les attributs de produit, et plus encore !

Pour accéder aux paramètres et aux options de modification des blocs, cliquez sur l’onglet Bloc situé dans le panneau latéral droit. Voici la liste des blocs de produit disponibles et quelques exemples de paramétrage des blocs depuis l’onglet Bloc de l’éditeur :

  • Produits par étiquettes
  • Produit mis en avant 
  • Produits choisis manuellement
  • Produits les mieux vendus
  • Produits par catégorie
  • Derniers produits
  • Produits en promotion
  • Produits par attribut
  • Produits les mieux notés

Permettre aux visiteurs d’explorer vos produits

↑ Back to top

Les trois blocs suivants vous permettent d’afficher toutes les catégories de produit sous forme de liste ou de liste déroulante, de mettre en avant une catégorie de manière visuelle et d’encourager une action rapide, et d’ajouter une zone de recherche permettant aux clients de rechercher des produits par mot-clé.

  • Liste des catégories de produit
  • Catégorie à la Une
  • Rechercher un produit

Afficher les avis des produits

↑ Back to top

Les trois blocs suivants vous permettent d’afficher une liste de tous les avis de produit, les avis de certains produits ou les avis de catégories spécifiques.

  • Tous les avis
  • Avis par produit
  • Avis par catégorie

Créer une page Boutique personnalisée

↑ Back to top

Les blocs suivants forment un ensemble idéal pour créer une page Boutique personnalisée, en permettant notamment aux clients de parcourir et de filtrer les produits par attribut ou par prix.

  • Tous les produits
  • Filtrer les produits par attribut
  • Filtrer les produits par prix
  • Filtres de produit actifs

Commencez par exemple avec le bloc Colonnes (inclus par défaut) pour créer une mise en page traditionnelle avec une colonne principale et une colonne latérale. Ajoutez ensuite le bloc Tous les produits dans la colonne principale. Ce bloc inclus des blocs Atomic Blocks qui permettent d’organiser la façon dont les produits sont affichés dans une grille. Sélectionnez le bloc Tous les produits puis cliquez sur l’icône Modifier (icône de crayon en haut à gauche). De nouvelles options apparaissent :

Vous pouvez utiliser les blocs Atomic Blocks pour ajouter, supprimer ou réarranger différents éléments comme l’Image produit, le Nom du produit, la Note du produit, le Prix du produit, la Description du produit et le Bouton Ajouter au panier.

Pour finir, ajoutez dans la colonne latérale une combinaison des trois blocs restants listés ci-dessus afin de permettre aux clients de filtrer les produits par attribut et/ou prix.

L’extension WooCommerce Blocks et plus

↑ Back to top

Les blocs inclus par défaut dans WooCommerce sont d’abord mis à disposition dans l’extension WooCommerce Blocks (lien disponible uniquement en anglais). Pour bénéficier d’un accès anticipé aux nouveaux blocs et aux améliorations des blocs existants, installez notre extension WooCommerce Blocks.

Pour en savoir plus sur les blocs Panier et Commande, consultez la page de développement des blocs Panier et Commande (lien disponible uniquement en anglais).

Pour en savoir plus sur l’extension WooCommerce Blocks ou pour suivre le développement des nouveaux blocs, consultez la page WooCommerce Blocks sur WordPress.org (lien disponible uniquement en anglais) ou le référentiel GitHub (lien disponible uniquement en anglais).