Affichage des sous catégories d'une catégorie

Magento ne permet pas par défaut d’afficher les sous catégories dans une page catégorie. Nous allons voir ici comment afficher les sous catégories sous forme de grille, avec vignette, titre de la catégorie et description courte. Pour cela nous allons créer un bloc statique ce qui nous permettra d’afficher les sous-catégories du catalogue Magento dans la catégorie de notre choix.

La manipulation suivante a été testé sur Magento v1.5.

Magento permettant d’afficher des blocs dans des catégories nous allons utiliser cette fonctionnalité pour un maximum de souplesse. Nous allons ainsi créer un bloc, un gabarit pour ce bloc, un style pour mettre en forme le listing et l’intégrer au webdesign de votre site, et enfin afficher ce bloc dans la catégorie.
Préparer un bloc statique

Dans l’administration de Magento aller dans CMS > Blocs Statiques. Cliquer sur le bouton Ajouter un Nouveau Bloc. Remplissez les champs de la façon suivante :

* Block Tittle : Liste des sous-catégories
* Identifier : liste_sous_categories
* Status : Enable
* Content :

{{block type="catalog/navigation" template="catalog/navigation/subcategory_listing.phtml"}}

Créer le gabarit pour l’affichage des sous-catégories

Dans le sous dossier : /app/design/frontend/base/Nom_De_Mon_Gabarit/template/catalog/navigation. Créer le fichier subcategory_listing.phtml

<?php $_categories = $this-getCurrentChildCategories();
foreach ($_categories as $_category):
$cur_category=Mage::getModel('catalog/category')->load($_category->getId());
?>
<div class="categorylisting">
<?php if($cur_category->getIsActive()): ?>
<div class="product-image">
<a href="<?php echo $cur_category->getURL(); ?>" title="<?php echo $this-<htmlEscape($cur_category->getName()) ?>">
<img src="<?php echo $cur_category->getImageUrl() ?>" width="140" alt="<?php echo $this->htmlEscape($cur_category->getName()) ?>" />
</a>
</div>
<h4>
<a href="<?php echo $cur_category->getURL() ?>" title="<?php echo $this-?>htmlEscape($cur_category-?>getName()) ?>" ?>
<?php echo $this-?>htmlEscape($cur_category-?>getName()) ?>
</a>
</h4>
<?php echo $cur_category->etDescription() ?>
<?php endif; ?>
</div>
<?php endforeach; ?>

Mettre en forme la liste des sous-catégories

Éditez la feuille de style et ajoutez les lignes suivantes :

.categorylisting {float:left;width:140px;height:170px;padding:10px;border:1px solid #ccc;margin:10px;text-align:left;}
.textcat {width:129px;padding:3px;padding-top:5px;height:30px;border:1px solid #ccc;margin-top:10px;background-color:#eeeeee;background-image:url(images/headcat.gif);background-repeat:repeat-x;}
.button { margin: 10px auto; font-size:1.2em; font-weight:bold; }
.catimg { margin:0 auto; }

Afficher la liste des sous-catégories

Dans l’administration de Magento aller dans Catalogue > Gestion des Catégories et éditez la catégorie dans laquelle vous voulez afficher les sous-catégories. Cliquez sur l’onglet des paramètres d’affichage.

* Display Mode : choisissez « Bloc Statique Seul » ou « Bloc statique et produits »
* CMS Block : sélectionnez le nom du bloc codant le listing des sous-catégories, si vous avez suivi les instructions depuis le début ce sera « Liste des sous-catégories »

Enregistrez les modifications effectués de la catégorie.

La liste de vos sous catégories s’affiche maintenant dans les catégories de votre choix. Modifiez le style CSS en fonction du webdesign de votre e-commerce Magento.