Table des matières
- Introduction
- L'importance de la Navigation en Couches
- Création d'un Module Personnalisé
- Création du Fichier XML de Mise en Page
- Affectation de la Mise à Jour de la Mise en Page à Votre Page CMS
- Assurer le Bon Fonctionnement de la Navigation en Couches
- Activation et Déploiement de Votre Module
- Conclusion
- FAQ
Introduction
Rencontrez-vous des difficultés pour ajouter la navigation en couches à votre page CMS Magento ? Si c'est le cas, vous n'êtes pas seul. De nombreux utilisateurs de Magento sont confrontés à des défis pour intégrer cette fonctionnalité cruciale, permettant aux clients de filtrer les produits en fonction de différents attributs directement sur des pages gérées par du contenu. La navigation en couches est un outil puissant qui améliore l'expérience utilisateur en permettant aux clients de trouver plus facilement les produits dont ils ont besoin. Dans cet article, nous vous guiderons étape par étape sur la façon d'afficher la navigation en couches sur votre page CMS Magento en utilisant un module personnalisé. À la fin de cet article, vous aurez une compréhension claire de comment intégrer cette fonctionnalité de manière transparente dans votre boutique Magento.
L'importance de la Navigation en Couches
La navigation en couches améliore considérablement l'expérience d'achat en permettant aux utilisateurs de filtrer les produits en fonction d'attributs tels que le prix, la couleur, la taille et la marque. Cette fonctionnalité est particulièrement utile pour les boutiques disposant d'un vaste inventaire, permettant aux clients de réduire rapidement leurs choix. La mise en place d'une navigation en couches efficace peut conduire à des taux de conversion plus élevés, car elle simplifie le processus de recherche de produits, augmentant ainsi les chances pour les visiteurs de trouver et d'acheter les produits qu'ils souhaitent.
Création d'un Module Personnalisé
Pour commencer, vous devrez créer un module personnalisé qui gérera la logique de la navigation en couches sur votre page CMS. Suivez ces étapes pour configurer votre module :
Structure du Répertoire
Tout d'abord, créez la structure de répertoire nécessaire pour votre module personnalisé. Cette structure doit se situer sous le répertoire app/code et suivre les conventions de nommage de Magento. Votre structure de répertoire devrait ressembler à ceci :
app/code/VotreVendeur/NavigationEnCouches/module.xml
À l'intérieur de votre répertoire de module, créez un fichier module.xml pour enregistrer votre module. Placez le contenu suivant dans ce fichier :
<?xml version="1.0"?><config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd"><module name="VotreVendeur_NavigationEnCouches" setup_version="1.0.0"></module></config>registration.php
Ensuite, créez un fichier registration.php pour enregistrer le module auprès de Magento :
<?php
\Magento\Framework\Component\ComponentRegistrar::register(
\Magento\Framework\Component\ComponentRegistrar::MODULE,
'VotreVendeur_NavigationEnCouches',
__DIR__
);
Création du Fichier XML de Mise en Page
Magento utilise des fichiers XML de mise en page pour déterminer comment différentes parties de votre boutique doivent être affichées. Vous devrez créer un fichier XML de mise en page pour spécifier comment et où la navigation en couches doit apparaître sur votre page CMS.
cms_page_view.xml
Créez un fichier XML de mise en page nommé cms_page_view.xml sous le répertoire suivant :
app/code/VotreVendeur/NavigationEnCouches/view/frontend/layout/Ajoutez le contenu suivant à cms_page_view.xml :
<?xml version="1.0"?><page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"><body><referenceContainer name="content"><block class="Magento\LayeredNavigation\Block\Navigation\State" name="layered.navigation.state" before="product_list" template="Magento_LayeredNavigation::layer/state.phtml"/><block class="Magento\LayeredNavigation\Block\Navigation" name="catalog.leftnav" before="-" template="Magento_LayeredNavigation::layer/view.phtml"/></referenceContainer></body></page>Affectation de la Mise à Jour de la Mise en Page à Votre Page CMS
Avec votre fichier XML de mise en page en place, l'étape suivante consiste à affecter cette mise à jour de la mise en page à votre page CMS spécifique. Suivez ces étapes :
- Accédez à
Contenu > Pagesdans le panneau d'administration Magento. - Sélectionnez la page CMS que vous souhaitez éditer.
- Allez à l'onglet
Conception. - Dans le champ
Mise à jour XML de la Mise en Page, ajoutez le code suivant :
<referenceContainer name="sidebar.main"><block class="VotreVendeur\NavigationEnCouches\Block\CustomNavigation" name="custom.layered.navigation" template="VotreVendeur_NavigationEnCouches::layer/view.phtml"/></referenceContainer>Assurer le Bon Fonctionnement de la Navigation en Couches
Parfois, la navigation en couches peut ne pas fonctionner par défaut en raison de la dépendance de la page CMS aux collections de produits et aux filtres, généralement associés aux pages de catégorie ou de résultats de recherche. Il peut être nécessaire d'étendre la classe de bloc pour garantir son bon fonctionnement.
Création d'un Bloc Personnalisé (si nécessaire)
Pour gérer la logique de collection de produits et de filtrage, créez une classe de bloc personnalisée si nécessaire. La mise en œuvre spécifique dépendra de vos exigences.
Remplacement du Modèle
Il peut être nécessaire de remplacer le fichier view.phtml par défaut pour le personnaliser pour votre page CMS. Placez le modèle personnalisé dans le répertoire suivant :
app/code/VotreVendeur/NavigationEnCouches/view/frontend/templates/layer/Activation et Déploiement de Votre Module
Enfin, activez votre module personnalisé et déployez le contenu statique pour refléter ces modifications :
Activez votre module :
php bin/magento module:enable VotreVendeur_NavigationEnCouches php bin/magento setup:upgradeDéployez le contenu statique :
php bin/magento setup:static-content:deploy
Conclusion
Ajouter la navigation en couches à une page CMS Magento peut considérablement améliorer l'expérience utilisateur en permettant aux clients de filtrer les produits en fonction de différents attributs directement à partir de pages gérées par du contenu. En suivant les étapes décrites dans ce guide, vous pouvez créer un module personnalisé pour gérer la navigation en couches sur votre page CMS, améliorant ainsi l'expérience d'achat de vos clients et augmentant potentiellement vos taux de conversion.
FAQ
Comment ajouter la navigation en couches à une page CMS dans Magento ?
Pour ajouter la navigation en couches à une page CMS, créez un module personnalisé, définissez le XML de mise en page et affectez la mise à jour de la mise en page à votre page CMS. Assurez-vous que la navigation en couches fonctionne correctement en étendant éventuellement la classe de bloc et en remplaçant le modèle par défaut si nécessaire.
Pourquoi la navigation en couches ne fonctionne-t-elle pas sur ma page CMS ?
La navigation en couches peut ne pas fonctionner sur les pages CMS par défaut car elle dépend généralement des collections de produits et des filtres associés aux pages de catégories ou de résultats de recherche. Vous devrez peut-être étendre la classe de bloc et personnaliser le modèle pour garantir son bon fonctionnement sur les pages CMS.
Puis-je personnaliser l'apparence de la navigation en couches sur ma page CMS Magento ?
Oui, vous pouvez personnaliser l'apparence en remplaçant le fichier de modèle view.phtml par défaut et en plaçant votre modèle personnalisé dans le répertoire approprié de votre module personnalisé.
