# 9 mises en page de boutique URL: https://canvaswp.com/fr/templates/shop/ Updated: 2026-11-03 Modèles Mises en page du catalogue WooCommerce : nombre de colonnes et positions de la barre latérale, pages de catégories, pages de filtres, puis le panier et le tunnel de commande. [Ouvrir la vitrine en direct](https://demos.canvaswp.com/classic/) [Parcourir les démos de sites web](https://canvaswp.com/fr/demos/) Mis à jour le 3 novembre 2026 - [4 colonnes (s’ouvre dans un nouvel onglet)](https://demos.canvaswp.com/classic/shop/) - [3 colonnes (s’ouvre dans un nouvel onglet)](https://demos.canvaswp.com/classic/shop-3/) - [2 colonnes (s’ouvre dans un nouvel onglet)](https://demos.canvaswp.com/classic/shop-2-right-sidebar/) - [1 colonne (s’ouvre dans un nouvel onglet)](https://demos.canvaswp.com/classic/shop-1/) - [Mises en page produit (s’ouvre dans un nouvel onglet)](https://demos.canvaswp.com/classic/product/pink-printed-dress/) - [Catégories - Parallax (s’ouvre dans un nouvel onglet)](https://demos.canvaswp.com/classic/shop-category-parallax/) - [Filtre combiné (s’ouvre dans un nouvel onglet)](https://demos.canvaswp.com/classic/shop-combination-filter/) - [Panier (s’ouvre dans un nouvel onglet)](https://demos.canvaswp.com/classic/cart/) - [Paiement (s’ouvre dans un nouvel onglet)](https://demos.canvaswp.com/xmas/xmas-checkout/) Chaque lien ouvre une vraie page de la vitrine en ligne, réalisée avec le même thème et les mêmes blocs que ceux que vous installez. Ce que contient chaque page ## Pages de boutique construites avec des blocs et des modèles WooCommerce gère la boutique : produits, stocks, panier et paiements. Canvas conçoit les pages que parcourt l'acheteur, et chacune de ces mises en page provient d'éléments livrés avec le thème et son extension. ### Colonnes du catalogue La page à quatre colonnes est la page boutique WooCommerce elle-même, générée par le modèle d'archive produits du thème. Les pages à trois, deux et une colonne contiennent le bloc Canvas Products, dont le réglage Columns détermine le nombre de colonnes par ligne, dans une page utilisant l'un des quatre modèles de boutique : pleine largeur, ou avec une barre latérale à gauche, à droite ou des deux côtés. ### Page produit Un produit reprend sa mise en page du modèle choisi pendant l'édition. Outre la page standard, il existe des versions avec une barre latérale d'un côté, de l'autre ou des deux, un résumé fixe, des pastilles de couleur et une liste de caractéristiques, ainsi qu'un modèle Galerie liée qui existe aussi en carrousel. ### Bannières de catégories Une pile de blocs Parallax Image en pleine hauteur, une image par catégorie, chacune se déplaçant au défilement de la page. Le bloc accepte sa propre superposition et son propre contenu, afin qu'un titre et un bouton puissent diriger les acheteurs vers cette partie de la boutique. ### Filtre combiné Le bloc Canvas Products, précédé de deux barres Grid Filter, l'une intitulée « Select Category » et l'autre « Sort By », permet à l'acheteur de réduire le catalogue à un type de produit et de le trier par nom ou par prix, instantanément, sans rechargement de la page. ### Panier Le panier de la démo utilise le bloc Cart fourni par WooCommerce. Canvas ajoute ses propres blocs Cart Table et Cart Totals pour une boutique qui souhaite mettre en page la page panier bloc par bloc. ### Paiement Un panier vide n'affiche aucun tunnel de paiement. Ce lien ouvre donc le paiement de la démo Christmas Store, construit avec les blocs Canvas Checkout Billing et Canvas Checkout Order Review. Cette démo s'importe avec ses produits et ce paiement déjà en place. Bien choisir ## Quel agencement de boutique correspond à votre catalogue Laissez la taille du catalogue guider le choix. Une petite gamme de produits aux belles photos se présente au mieux en cartes larges, deux ou trois par ligne, ou sur une seule colonne lorsque chaque produit mérite un paragraphe. Un grand catalogue nécessite davantage de contenu à l'écran à la fois, et c'est précisément à quoi sert la page boutique sur quatre colonnes. Utilisez le filtre combiné lorsque les acheteurs raisonnent de deux façons à la fois, par type puis par prix. Placez des bannières de catégories sur la page d’accueil ou dans un lookbook, là où l’image vend avant que la grille ne le fasse. Sur la page produit, choisissez le modèle en fonction de ce qui incite à l'achat. Les vêtements se vendent sur la couleur : la version avec sélecteur de couleurs se justifie donc. Les produits techniques se vendent sur le détail, et c'est à cela que sert la liste des caractéristiques, tandis qu'un résumé fixe garde le prix et le bouton visibles sur une page longue. 21 sur les 88 sites de démo s'importent sous forme de boutiques WooCommerce, avec les produits, les catégories et les pages panier et paiement déjà en place. ### Fonctionnalités de la boutique 24 blocs WooCommerce et 18 modèles de boutique, de la galerie de produits au récapitulatif de commande. - [WooCommerce dans Canvas](https://canvaswp.com/fr/woocommerce/) ### Pas à pas Produits, page boutique, page produit, panier et paiement, dans l'ordre où vous les construiriez. - [Démarrer une boutique WooCommerce](https://canvaswp.com/fr/guides/start-a-woocommerce-store-with-wordpress/) ### Les démos de boutique Mode, poterie, mobilier et bien d'autres, chacun prévisualisé page par page avant de l'importer. - [Démos e-commerce, comparées](https://canvaswp.com/fr/wordpress-themes/ecommerce/) Plus de modèles ## Le reste de la bibliothèque - [Modèles de page 13](https://canvaswp.com/fr/templates/page-templates/) - [Shortcodes et éléments 57](https://canvaswp.com/fr/templates/shortcodes/) - [Mises en page Portfolio 27](https://canvaswp.com/fr/templates/portfolio/) - [Mises en page du blog 35](https://canvaswp.com/fr/templates/blog/)