How is the main frontend menu generated? (before Magento 2.1.0-rc1)

dmitry_fedyuk · May 25, 2016, 12:05am

The way is very similar to the Magento 1.x.

Step 1

magento/magento2/blob/22629abe10f9c640fe47b6081d57fedccdea8e0f/app/code/Magento/Theme/view/frontend/templates/html/topmenu.phtml#L18




?>
<?php
/**
* Top menu for store
*
* @see \Magento\Theme\Block\Html\Topmenu
*/
?>
<?php $columnsLimit = $block->getColumnsLimit() ?: 0; ?>
<?php $_menu = $block->getHtml('level-top', 'submenu', $columnsLimit) ?>


<nav class="navigation" role="navigation">
   <ul data-mage-init='{"menu":{"responsive":true, "expanded":true, "position":{"my":"left top","at":"left bottom"}}}'>
       <?php /* @escapeNotVerified */ echo $_menu; ?>
   </ul>
</nav>

Step 2

github.com

magento/magento2/blob/22629abe10f9c640fe47b6081d57fedccdea8e0f/app/code/Magento/Theme/Block/Html/Topmenu.php#L72-L75


$this->_eventManager->dispatch(
    'page_block_html_topmenu_gethtml_before',
    ['menu' => $this->_menu, 'block' => $this]
);

Step 3

github.com

magento/magento2/blob/22629abe10f9c640fe47b6081d57fedccdea8e0f/app/code/Magento/Catalog/Observer/AddCatalogToTopmenuItemsObserver.php#L54


/**
 * Checking whether the using static urls in WYSIWYG allowed event
 *
 * @param \Magento\Framework\Event\Observer $observer
 * @return void
 */
public function execute(\Magento\Framework\Event\Observer $observer)
{
    $block = $observer->getEvent()->getBlock();
    $block->addIdentity(\Magento\Catalog\Model\Category::CACHE_TAG);
    $this->_addCategoriesToMenu($this->catalogCategory->getStoreCategories(), $observer->getMenu(), $block);
}


/**
 * Recursively adds categories to top menu
 *
 * @param \Magento\Framework\Data\Tree\Node\Collection|array $categories
 * @param \Magento\Framework\Data\Tree\Node $parentCategoryNode
 * @param \Magento\Theme\Block\Html\Topmenu $block
 * @return void
 */

Step 4

github.com

magento/magento2/blob/22629abe10f9c640fe47b6081d57fedccdea8e0f/app/code/Magento/Catalog/Helper/Category.php#L115


        return [];
    }


    $recursionLevel = max(
        0,
        (int)$this->scopeConfig->getValue(
            'catalog/navigation/max_depth',
            \Magento\Store\Model\ScopeInterface::SCOPE_STORE
        )
    );
    $storeCategories = $category->getCategories($parent, $recursionLevel, $sorted, $asCollection, $toLoad);


    $this->_storeCategories[$cacheKey] = $storeCategories;
    return $storeCategories;
}


/**
 * Retrieve category url
 *
 * @param ModelCategory $category
 * @return string

Step 5

github.com

magento/magento2/blob/22629abe10f9c640fe47b6081d57fedccdea8e0f/app/code/Magento/Catalog/Model/Category.php#L947


 *
 * @param int $parent
 * @param int $recursionLevel
 * @param bool $sorted
 * @param bool $asCollection
 * @param bool $toLoad
 * @return \Magento\Framework\Data\Tree\Node\Collection|\Magento\Catalog\Model\ResourceModel\Category\Collection
 */
public function getCategories($parent, $recursionLevel = 0, $sorted = false, $asCollection = false, $toLoad = true)
{
    $categories = $this->getResource()->getCategories($parent, $recursionLevel, $sorted, $asCollection, $toLoad);
    return $categories;
}


/**
 * Return parent categories of current category
 *
 * @return \Magento\Framework\DataObject[]|\Magento\Catalog\Model\Category[]
 */
public function getParentCategories()
{

Step 6

github.com

magento/magento2/blob/22629abe10f9c640fe47b6081d57fedccdea8e0f/app/code/Magento/Catalog/Model/ResourceModel/Category.php#L628-L640


public function getCategories($parent, $recursionLevel = 0, $sorted = false, $asCollection = false, $toLoad = true)
{
    $tree = $this->_categoryTreeFactory->create();
    /* @var $tree \Magento\Catalog\Model\ResourceModel\Category\Tree */
    $nodes = $tree->loadNode($parent)->loadChildren($recursionLevel)->getChildren();


    $tree->addCollectionData(null, $sorted, $parent, $toLoad, true);


    if ($asCollection) {
        return $tree->getCollection();
    }
    return $nodes;
}

Step 7

github.com

magento/magento2/blob/487f5f45/app/code/Magento/Theme/view/frontend/templates/html/topmenu.phtml#L21-L24


<ul data-mage-init='{"menu":{"responsive":true, "expanded":true, "position":{"my":"left top","at":"left bottom"}}}'>
    <?php /* @escapeNotVerified */ echo $_menu; ?>
    <?php /* @escapeNotVerified */ echo $block->getChildHtml(); ?>
</ul>

Step 8

github.com

magento/magento2/blob/487f5f45/lib/web/mage/menu.js#L14-L17


/**
 * Menu Widget - this widget is a wrapper for the jQuery UI Menu
 */
$.widget('mage.menu', $.ui.menu, {

Step 9

dmitry_fedyuk · May 25, 2016, 12:09am

The behavior has been changed from Magento 2.1.0-rc1:

https://github.com/magento/magento2/commit/078af98a52912fbae0142577ae4da422bb6705dd

How is the main frontend menu generated? (from Magento 2.1.0-rc1)

dmitry_fedyuk · June 27, 2016, 2:52am

A post was merged into an existing topic: Breaking point of menu