Magento 2 Subcategories – How to Organize and Make Blocks

magento2submenu

I want to make sub categories in navigation bar to display in organized blocks. How can i achieve it through coding.

Like the one in
http://rashmian.com/
http://alothemes.com/demo/supermarket/index.php/?___store=english_2

Where category having long sub categories are organized well.

In first link they have used megamenu extension. However if I want any free extension or want to achieve it by coding.

Best Answer

Create custom block:

class Categories extends \Magento\Framework\View\Element\Template
{

protected $_itemCollectionFactory;
protected $_request;
protected $_categoryFactory;

public function __construct(
    \Magento\Framework\View\Element\Template\Context $context,
    \Magento\Catalog\Model\ResourceModel\Category\CollectionFactory $categoriesCollection,
    \Magento\Catalog\Model\CategoryFactory  $categoryFactory,
    \Magento\Framework\App\Request\Http $request,
    array $data = []
) {
    $this->_itemCollectionFactory = $categoriesCollection;
    $this->_categoryFactory = $categoryFactory;
    $this->_request = $request;
    parent::__construct($context, $data);
}

public function getContent()
{
    return __("Shop By Categories");
}

public function getMainCategories()
{
    $categoryFactory = $this->_itemCollectionFactory->create()
                            ->addAttributeToSelect('*');

    return $categoryFactory;
}

public function getSubCategoryList($category)
{
  $collection = $this->_categoryFactory->create()->getCollection()->addAttributeToSelect('*')
          ->addAttributeToFilter('is_active', 1)
          ->setOrder('position', 'ASC')
          ->addIdFilter($category->getChildren());
  return $collection;

 }
}

Layout xml: 

   <referenceContainer name="content">
        <block class="Ktpl\Shopbycategories\Block\Homepagecategories" name="categories_display" template="vendor_Shopbycategories:categories.phtml" />
    </referenceContainer>

Template categories.phtml :

<?php
      $catTitle = $block->getContent();
      $mainCats = $block->getMainCategories();
      $subcats = $block->getMainCategories();
 ?>
 <h2><b><?php echo __($catTitle); ?></b></h2>
 <hr>
    <?php foreach ($mainCats as $category): ?>
        <?php if ($category->getLevel() == 2): ?>
        <div style="box-shadow: 5px 5px 5px 5px rgb(237,237,237); width: 270px;height: 225px;float:left; margin: 10px 20px">
            <div class="categories" style="margin: 10px 20px;">
                <div class="category-title">
                    <h3><b><?php echo __($category->getName()); ?></b></h3>
                </div>
                <?php $subcount = 0; ?>
                <?php foreach ($subcats as $key => $subcategory):?>
                        <?php if ($category->getId() == $subcategory->getParentId()):?>
                                <div class="sub-categories">
                                    <a href="#">
                                        <?php echo __($subcategory->getName()); ?>  
                                    </a>
                                </div>              
                            <?php $subcount++; ?>
                        <?php endif;?>
                        <?php if ($subcount == '5'){break;} ?>
                <?php endforeach; ?>
                <hr>
                <div class="shop-by-all-categories">
                    <a href="<?php echo $block->getUrl('categories/index/view/id/' . $category->getId()) ?>">
                        <?php echo __("Shop All " . $category->getName()); ?>
                    </a>
                </div>
            </div>              
        </div>
      <?php endif; ?>
  <?php endforeach; ?>
Related Topic