Criando menus de categorias e subcategorias no Magento

Algo recorrente ao se desenvolver temas e lojas em Magento é a necessidade de criar um menu conforme a equipe de Design o passa. Apesar de o menu nativo já ser razoável, sempre há no que mexer ou mesmo criar um outro do zero em um novo bloco/módulo.

Não irei discutir aqui qual a melhor prática para se fazer o menu, pois não é o foco do post, porém fique atento a sempre fazer seus temas de modo uma atualização do core não o sobrescreva (problema muito comum e recorrente).

Basicamente, os menus são utilizados para a categorização dos produtos. Há os menus fixos que exibem as categorias. Há também categorias com subcategorias, sem alguns com efeitos (javascript) e outros não, isso varia de caso para caso, mas o que nós, desenvolvedores, precisamos fazer é apenas recuperar as categorias e exibi-las na tela, o resto é efeito em cima, seja com Javascript, seja com CSS.

Criando um menu com as categorias principais (categorias abaixo da categoria root)

<?php
/*
 * Código criado baseado em tutoriais de http://fishpig.co.uk
 *
**/
?>
<?php $_helper = Mage::helper('catalog/category') ?>
<?php $_categories = $_helper->getStoreCategories() ?>
<?php if (count($_categories) > 0): ?>
 <ul>
 <?php foreach($_categories as $_category): ?>
 <li>
 <a href="<?php echo $_helper->getCategoryUrl($_category) ?>">
 <?php echo $_category->getName() ?>
 </a>
 </li>
 <?php endforeach; ?>
 </ul>
<?php endif; ?>

No código acima deve lembrar-se sempre do helper, analisar se é necessário chamá-lo ou não, dependendo do bloco que você está utilizando. Caso você esteja modificando o menu nativo do magento, provavelmente o helper de categorias já estará carregado.

Já em um bloco criado por você, provavelmente será necessário carrega-lo.

Criando um menu com as categorias principais e todas as subcategorias (árvore de categorias completa)

<?php
/*
 * Código criado baseado em tutoriais de http://fishpig.co.uk
 *
**/
?>
<?php $_helper = Mage::helper('catalog/category') ?>
<?php $_categories = $_helper->getStoreCategories() ?>
<?php $currentCategory = Mage::registry('current_category') ?>
<?php if (count($_categories) > 0): ?>
 <ul>
 <?php foreach($_categories as $_category): ?>
 <li>
 <a href="<?php echo $_helper->getCategoryUrl($_category) ?>">
 <?php echo $_category->getName() ?>
 </a>
 <?php $_category = Mage::getModel('catalog/category')->load($_category->getId()) ?>
 <?php $_subcategories = $_category->getChildrenCategories() ?>
 <?php if (count($_subcategories) > 0): ?>
 <ul>
 <?php foreach($_subcategories as $_subcategory): ?>
 <li>
 <a href="<?php echo $_helper->getCategoryUrl($_subcategory) ?>">
 <?php echo $_subcategory->getName() ?>
 </a>
 </li>
 <?php endforeach; ?>
 </ul>
 <?php endif; ?>
 </li>
 <?php endforeach; ?>
 </ul>
<?php endif; ?>

Esse menu é o mais completo. Pode ser combinado com javascript para quando a pessoa passar o mouse sobre a categoria, já expandir a exibição das subcategorias da mesma.

Criando menu de categorias principais e subcategorias da categoria corrente

<?php
/*
 * Código criado baseado em tutoriais de http://fishpig.co.uk
 *
**/
?>
<?php $_helper = Mage::helper('catalog/category') ?>
<?php $_categories = $_helper->getStoreCategories() ?>
<?php $currentCategory = Mage::registry('current_category') ?>
<?php if (count($_categories) > 0): ?>
 <ul>
 <?php foreach($_categories as $_category): ?>
 <li>
 <a href="<?php echo $_helper->getCategoryUrl($_category) ?>">
 <?php echo $_category->getName() ?>
 </a>
 <?php if ($currentCategory &amp;&amp; $currentCategory->getId() == $_category->getId()): ?>
 <?php $_category = Mage::getModel('catalog/category')->load($_category->getId()) ?>
 <?php $_subcategories = $_category->getChildrenCategories() ?>
 <?php if (count($_subcategories) > 0): ?>
 <ul>
 <?php foreach($_subcategories as $_subcategory): ?>
 <li>
 <a href="<?php echo $_helper->getCategoryUrl($_subcategory) ?>">
 <?php echo $_subcategory->getName() ?>
 </a>
 </li>
 <?php endforeach; ?>
 </ul>
 <?php endif; ?>
 <?php endif; ?>
 </li>
 <?php endforeach; ?>
 </ul>
<?php endif; ?>

Esse menu exibe apenas as categorias principais, porém quando você entra em uma delas, no menu – após o próximo pageload – serão exibidas as subcategorias da categoria corrente.

O segundo menu, ao meu ver, é o mais adequado pois evita pageload desnecessários fazendo com que o usuário vá direto para a seleção de produtos de interesse.

[toggle title=”Fonte”]
http://denisspalenza.com/
[/toggle]

2014-07-01T19:45:37+00:00