3

I have been very happy so far with "Responsive Custom Menu", however it does not have the option to pull in thumbnail images for categories and subcategories on the menu. I was about to extend it by adding a getThumbnail call to the getter and renderers for this navbar, but ran into some issues where it did not construct the url properly.

It seems that the main files to modify would be app/code/local/WP/CustomMenu/Block/Navigation.php and perhaps app/design/frontend/default/default/template/webandpeople/custommenu/top.phtml.

Can anyone provide some specific modifications that would insert the thumbnails into the menu for further styling?

Additionally, I'm fine with modifying this extension directly to provide these thumbnails, but would there be a better method to extend an extension such as this so that updates are still tenable and likely still work?

EDIT:

It seems that this may hold some keys here to implementing this properly: http://www.h-o.nl/blog/using_category_images_in_your_magento_navigation/

2

Override the observer

            <page_block_html_topmenu_gethtml_before>
            <observers>                    
                <catalog_add_topmenu_items>
                    <type>disabled</type>
                </catalog_add_topmenu_items>
                <custom_catalog_add_topmenu_items>
                    <class>custom_catalog/observer</class>
                    <method>addCatalogToTopmenuItems</method>
                </custom_catalog_add_topmenu_items>                    
            </observers>
        </page_block_html_topmenu_gethtml_before>           

Then in your observer, these three function. Modify to your needs.

    /**
 * Adds catalog categories to top menu
 *
 * @param Varien_Event_Observer $observer
 */
public function addCatalogToTopmenuItems(Varien_Event_Observer $observer)
{
    $block = $observer->getEvent()->getBlock();
    $block->addCacheTag(Mage_Catalog_Model_Category::CACHE_TAG);
    $this->_addCategoriesToMenu(
        Mage::helper('catalog/category')->getStoreCategories(), $observer->getMenu(), $block, true
    );
}

/**
 * Recursively adds categories to top menu
 *
 * @param Varien_Data_Tree_Node_Collection|array $categories
 * @param Varien_Data_Tree_Node $parentCategoryNode
 * @param Mage_Page_Block_Html_Topmenu $menuBlock
 * @param bool $addTags
 */
protected function _addCategoriesToMenu($categories, $parentCategoryNode, $menuBlock, $addTags = false)
{
    $categoryModel = Mage::getModel('catalog/category');
    foreach ($categories as $category) {
        if (!$category->getIsActive()) {
            continue;
        }

        $nodeId = 'category-node-' . $category->getId();

        $categoryModel->setId($category->getId());
        if ($addTags) {
            $menuBlock->addModelTags($categoryModel);
        }

        $tree = $parentCategoryNode->getTree();
        $categoryData = array(
            'name' => $category->getName(),
            'id' => $nodeId,
            'url' => Mage::helper('catalog/category')->getCategoryUrl($category),
            'is_active' => $this->_isActiveMenuCategory($category)
        );
        $categoryNode = new Varien_Data_Tree_Node($categoryData, 'id', $tree, $parentCategoryNode);
        $parentCategoryNode->addChild($categoryNode);

        $flatHelper = Mage::helper('catalog/category_flat');
        if ($flatHelper->isEnabled() && $flatHelper->isBuilt(true)) {
            $subcategories = (array)$category->getChildrenNodes();
        } else {
            $subcategories = $category->getChildren();
        }

        $this->_addCategoriesToMenu($subcategories, $categoryNode, $menuBlock, $addTags);
    }
}

/**
 * Checks whether category belongs to active category's path
 *
 * @param Varien_Data_Tree_Node $category
 * @return bool
 */
protected function _isActiveMenuCategory($category)
{
    $catalogLayer = Mage::getSingleton('catalog/layer');
    if (!$catalogLayer) {
        return false;
    }

    $currentCategory = $catalogLayer->getCurrentCategory();
    if (!$currentCategory) {
        return false;
    }

    $categoryPathIds = explode(',', $currentCategory->getPathInStore());
    return in_array($category->getId(), $categoryPathIds);
}   
2

Old thread but maybe this will someone help for magento menu. Did this for 1.9.2.2 but probably will work in older versions too.

In custom module config.xml file add this:

<frontend>
    <category>
        <collection>
            <attributes>
                <image />
            </attributes>
        </collection>
    </category>
<frontend>

Then override Mage/Catalog/Model/Observer.php function _addCategoriesToMenu() and add 'image' to array:

$categoryData = array(
    'name' => $category->getName(),
    'id' => $nodeId,
    'url' => Mage::helper('catalog/category')->getCategoryUrl($category),
    'is_active' => $this->_isActiveMenuCategory($category),
    'image' => $category->getImage()
);

Then you will be able to use image in template renderer.phtml file.

  • it seems that $category->getImage() always returns null. For some reason it seems $category isn't loading all the category's attributes. I'm using 1.9.3.1. Using Mage::getModel('catalog/category')->load($category->getId())->getThumbnail() would solve the problem, but doesn't seem very performant. – greatwitenorth Feb 16 '17 at 17:24
1

Its not too difficult, but keep in mind that Category Thumbnail images are not resized and served from size appropriate cache files the way product images are. So you'll want to upload properly sized images to keep your site fast. The code below should get you the image you're looking for.

$_helper = Mage::helper('catalog/category');
$_categories = $_helper->getStoreCategories();
 <?php foreach ($_categories as $_category): 
       $_categoryThumb = $_category->getThumbnail();
?>
<li>
    <a href="<?php echo $_helper->getCategoryUrl($_category) ?>">
        <img src="<?php echo $this->getUrl() . 'media/catalog/category/' . $_categoryThumb; ?>" alt="<?php echo $_category->getName()?>"/>
     <?php echo $_category->getName() ?>
     </a>
</li>
  • I'm curious to find out if the above worked? We're in the process of trying to do something similar. I wonder if there is a way of automatically pulling in an image from a product in that category? Rather than having to manually upload an image for each category. We have around 1200 categories in total...... so for us it wouldn't be feasible to upload an image for each one. – MagentoMac Oct 31 '13 at 9:02
  • Not working for me. Tested on Magento 1.9.0 – Andhi Irawan Sep 30 '15 at 4:05
0

For Magento 1.9 + WP-CustomMenu this works without touching core files.

Create an extension and add this to your config.xml

<frontend>
    <category>
        <collection>
            <attributes>
                <image />
            </attributes>
        </collection>
    </category>
<frontend>

If flat categories are disabled, this should be enough to access $child->getImage() in WP_CustomMenu_Block_Navigation::drawMenuItem()

To make it work with flat tables add an observer to config.xml

<events>
    <catalog_category_flat_loadnodes_before>
        <observers>
            <add_category_attribute>
                <type>model</type>
                <class>[module]/observer</class>
                <method>addCategoryAttributes</method>
            </add_category_attribute>
        </observers>
    </catalog_category_flat_loadnodes_before>
</events>

Observer.php

public function addCategoryAttributes(Varien_Event_Observer $observer)
{
    $observer->getSelect()->columns(
        array('image')
    );
}

... and reindex category flat tables.


If you want to rewrite WP_CustomMenu_Block_Navigation you also have to rewrite WP_CustomMenu_Helper_Data::getMenuData()

Change:

$blockClassName = Mage::getConfig()->getBlockClassName('custommenu/navigation');
$block = new $blockClassName();

To:

$blockClassName = Mage::getConfig()->getBlockClassName('your/block');
$block = new $blockClassName();

How to get the rewritten blockname?

-2

This solution is for Magento -1.8.*

In Model file. (/app/code/core/Mage/Catalog/Model/Observer.php)

Update following code in Function Name: _addCategoriesToMenu

  $categoryData = array( 
        'name' => $category->getName(),
        'id' => $nodeId,
        'url' => Mage::helper('catalog/category')->getCategoryUrl($category),
        'is_active' => $this->_isActiveMenuCategory($category),
        'thumbnail' => Mage::getModel('catalog/category')->load($category->getId())->getThumbnail()

    );

Then go into Html folder. (app/code/core/Mage/Page/Block/Html/Topmenu.php)

Update the following line of code at line 128 in

Function name: _getHtml

        $urls = Mage::getBaseUrl('media').'catalog/category/'.$child->getData('thumbnail');
        $img = '<img src="'.$urls.'" />';

    $html .= '<li ' . $this->_getRenderedMenuItemAttributes($child) . '>';
    $html .= '<a href="' . $child->getUrl() . '" ' . $outermostClassCode . '><span>'
        . $this->escapeHtml($child->getName()) . ' </span> '.$img.' </a>';
  • 2
    I have to actually vote this down... you shouldn't be editing code in a core file, especially an observer to achieve this. If you want to create your own observer in your own package and hook onto the same even and modify the data @ that point, that would be acceptable. Additionally you're doing a model load each time, this is really non-performant... the solution I posted below using a Collection is much more appropriate and performant. – mprototype Dec 12 '13 at 3:34
  • 2
    Agree with above comment. Override the observer action and modify at your pleasure. – Ben Truby May 16 '14 at 15:57

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.