Magento 2 : Show category with images in homepage

magento.stackexchange https://magento.stackexchange.com/questions/327043

Question

I want to display all category list on home page.

Show categories details like categories name with categories page link, categories image and categories description.

Thanks.

Was it helpful?

Solution 3

I have used extension for it.

Category with image widget for Magento 2

It's worked like a charm for me. If you want category details by choosing specific or all, you can create widget from admin and display it anywhere in front end, you can use this without any hesitation.

OTHER TIPS

Block :

<?php

      namespace <name_space>\<module_name>\Block;

      class Homepagecategories 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 isHomepage()
{

    if ($this->_request->getFullActionName() == 'cms_index_index') {
        return true;
    }
    return false;
}

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;

}

}

Controller : 

<?php

    namespace <name_space>\<module_name>\Controller\Index;

     class View extends \Magento\Framework\App\Action\Action
    {

/**
 * @var \Magento\Framework\View\Result\PageFactory
 */
protected $resultPageFactory;

/**
 * Request instance
 *
 * @var \Magento\Framework\Registry
 */
protected $_coreRegistry;

/**
 * @param \Magento\Framework\App\Action\Context $context
 * @param \Magento\Framework\View\Result\PageFactory $resultPageFactory
 */
public function __construct(
    \Magento\Framework\App\Action\Context $context,
    \Magento\Framework\Registry $coreRegistry,
    \Magento\Framework\View\Result\PageFactory $resultPageFactory
)
{

    $this->resultPageFactory = $resultPageFactory;

    $this->_coreRegistry = $coreRegistry;
    parent::__construct($context);
}

/**
 * Loads page content
 *
 * @return \Magento\Framework\View\Result\Page
 */
public function execute()
{
    $catId = (int)$this->getRequest()->getParam('id', false);
    $this->_coreRegistry->register('catid', $catId);

    $resultPage = $this->resultPageFactory->create();
    $resultPage->getConfig()->getTitle()->set(__('All Categories'));

    return $resultPage;
}

}

Frontend Layout : 

<?xml version="1.0"?>

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
    <referenceContainer name="content">
        <block class="<name_space>\<module_name>\Block\Homepagecategories" name="categories_display" template="namespace_module_name::homepagecategories.phtml" />
    </referenceContainer>
</body>
   </page>

Template : (Here you have collection of all categories)

<?php  $isHome = $block->isHomepage(); ?>
<?php if ($isHome): ?>
<?php
       $catTitle = $block->getContent();
       $mainCats = $block->getMainCategories();
       $subcats = $block->getMainCategories();

And the main thing is, To override cms_index_index (add sequence in etc/module.xml):

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
<module name="module_name" setup_version="1.0.0">
    <sequence>
        <module name="Magento_Cms"/>
    </sequence> 
</module> 
</config>

You can use this code in your block function and call in home page.

 public function functionName(){
    $this->_objectManager      = \Magento\Framework\App\ObjectManager::getInstance(); //object manager you can also get from constructor   
    $categoryFactory = $this->_objectManager->create('Magento\Catalog\Model\ResourceModel\Category\CollectionFactory');
    $_categories     = $categoryFactory->create()->addAttributeToSelect('*');
    return $_categories;
}

and call this function in you phtml.

...
    foreach($block->functionName() as $category){
        $optionsValue[] = ['label' => $category->getName()];//get your required value
    }
   print_r($optionValue);
...

Category with image widget for Magento 2 extension is not working with me. I received this error

There has been an error processing your request

Exception printing is disabled by default for security reasons.

Error log record number: 571087552076

Everytime I enable the extension , I just simply follow these steps:

php bin/magento setup:upgrade
php bin/magento cache:flush
Re-Compile (in-case you have compilation enabled)
bin/magento setup:di:compile
Licensed under: CC-BY-SA with attribution
Not affiliated with magento.stackexchange
scroll top