Dispositions de pages
La mise en page de chaque page de votre magasin se compose de sections ou de conteneurs distincts, qui définissent l’en-tête, le pied de page et les zones de contenu de la page. Selon la disposition, chaque page peut contenir une, deux, trois colonnes ou plus. Vous pouvez considérer la mise en page comme le plan de sol de la page et attribuer une mise en page spécifique à utiliser par défaut pour les pages CMS, de produit et de catégorie.
Sur la page, les blocs de contenu flottent pour remplir l’espace disponible, selon la section de la mise en page où ils doivent apparaître. Notez que si vous changez la mise en page de trois colonnes à deux colonnes, le contenu de la zone principale se développe pour remplir l’espace disponible. Notez également que les blocs associés à la barre latérale inutilisée semblent disparaître. Toutefois, si vous restaurez la mise en page à trois colonnes, les blocs réapparaîtront. Cette approche fluide, ou disposition liquide, permet de modifier la mise en page sans avoir à retravailler le contenu. Si vous êtes habitué à travailler avec des pages d’HTML individuelles, cette approche modulaire de bloc de création nécessite une manière de penser différente.
Configuration des dispositions par défaut
-
Sur la barre latérale Admin, accédez à Stores > Settings>Configuration.
-
Dans le panneau de gauche sous General, choisissez Web.
-
Développez la section
-
Sélectionnez le Default Product Layout que vous souhaitez utiliser pour les pages de produits.
Ce paramètre détermine la mise en page utilisée par défaut pour les pages de produits.
No layout updates- Les mises à jour de mise en page ne sont pas disponibles pour les pages de produits.Empty- Utilise une mise en page vierge pour les pages de produits.1 column- Utilise une mise en page à une seule colonne pour les pages de produits.2 columns with left bar- Utilise une mise en page à deux colonnes avec la barre latérale gauche pour les pages de produit.2 columns with right bar- Utilise une mise en page à deux colonnes avec la barre latérale à droite pour les pages de produit.3 columns- Utilise une mise en page à trois colonnes avec des encadrés à gauche et à droite pour les pages de produits.
Lorsque Page Builder est activé, d’autres options de pleine largeur sont disponibles. Vous pouvez ensuite utiliser les outils de contenu du Créateur de pages pour concevoir la mise en page de vos pages de produits.
Page -- Full Width- Utilise la disposition Page - Largeur complète pour les pages de produit.Category -- Full Width- Utilise la disposition Catégorie - Largeur complète pour les pages de produits.Product -- Full Width- (Recommandé) Utilise la disposition Produit - Largeur complète pour les pages de produit.
-
Sélectionnez le Default Category Layout à utiliser pour les pages de catégorie.
Ce paramètre détermine la mise en page utilisée par défaut pour les pages de catégorie.
No layout updates- Les mises à jour de mise en page ne sont pas disponibles pour les pages de catégorie.Empty- Utilise une mise en page vierge pour les pages de catégorie.1 column- Utilise une mise en page à une seule colonne pour les pages de catégorie.2 columns with left bar- Utilise une mise en page à deux colonnes avec la barre latérale gauche pour les pages de catégorie.2 columns with right bar- Utilise une mise en page à deux colonnes avec la barre latérale droite pour les pages de catégorie.3 columns- Utilise une mise en page à trois colonnes avec des encadrés à gauche et à droite pour les pages de catégorie.
Lorsque Page Builder est activé, d’autres options de pleine largeur sont disponibles. Vous pouvez ensuite utiliser les outils de contenu du Créateur de pages pour concevoir la mise en page de vos pages de catégorie.
Page -- Full Width- Utilise la disposition Page - Largeur complète pour les pages de catégorie.Category -- Full Width- (Recommandé) Utilise la disposition Catégorie - Largeur complète pour les pages de catégorie.Product -- Full Width- Utilise la disposition Produit - Largeur complète pour les pages de catégorie.
-
Sélectionnez le Default Page Layout que vous souhaitez utiliser pour les pages CMS.
Ce paramètre détermine la mise en page utilisée par défaut pour les pages CMS.
No layout updates- Les mises à jour de mise en page ne sont pas disponibles pour les pages CMS.Empty- Utilise une disposition vierge pour les pages CMS.1 column- Utilise une mise en page à une seule colonne pour les pages CMS.2 columns with left bar- Utilise une mise en page à deux colonnes avec la barre latérale gauche pour les pages CMS.2 columns with right bar- Utilise une mise en page à deux colonnes avec la barre latérale à droite pour les pages CMS.3 columns- Utilise une mise en page à trois colonnes avec des encadrés à gauche et à droite pour les pages CMS.
Lorsque Page Builder est activé, d’autres options de pleine largeur sont disponibles. Vous pouvez ensuite utiliser les outils de contenu du Créateur de pages pour concevoir la mise en page de vos pages CMS.
Page -- Full Width- (Recommandé) Utilise la disposition Page - Largeur complète pour les pages CMS.Category - Full Width- Utilise la disposition Catégorie - Largeur complète pour les pages CMS.Product - Full Width- Utilise la disposition Produit - Largeur complète pour les pages CMS.
-
Une fois l’opération terminée, cliquez sur Save Config.
Disposition de pages standard
Une colonne
La disposition 1 Column peut être utilisée pour créer une page d’accueil spectaculaire avec une grande image ou un point focal. Il s’agit également d’un bon choix pour une page d’entrée ou toute autre page qui comporte une combinaison de texte, d’images et de vidéo.
Deux colonnes avec la barre de gauche
La disposition 2 Columns with Left Bar est souvent utilisée pour les pages avec une navigation à gauche, comme un catalogue ou des pages de résultats de recherche avec une navigation par couches. Il s’agit également d’un excellent choix pour les pages d’accueil qui nécessitent une navigation supplémentaire ou des blocs de contenu pris en charge sur la gauche.
Deux colonnes avec barre droite
Avec une disposition 2 Columns with Right Bar, la zone de contenu principale est suffisamment grande pour accueillir une image ou une bannière accrocheuse. Cette disposition est également souvent utilisée pour les pages de produit avec des blocs de contenu pris en charge à droite.
Trois colonnes
La mise en page 3 Column comporte une colonne centrale suffisamment large pour le texte principal de la page, avec une marge de navigation supplémentaire et des blocs de contenu de prise en charge sur chaque côté.
Vide
La disposition Empty peut être utilisée pour définir des mises en page personnalisées.