How To

How to Show List of All Categories with Links at Sidebar on Category Page in Magento 2

Hello, Magento Folks,

Last time we learned how you can Remove decimals from quantity in the product grid of Magento 2 admin. Today we are here to explain how you can show the list of all categories with links at the sidebar on the category page in Magento 2.

When you need to show all of the categories to the customer, you can do so with the help of coding knowledge. You can show a list of all categories so the customer can easily navigate from one category to another with ease. The following code will add all of the categories with links to the sidebar of the category page.

1] First, we need to add 2columns-left.xml file at the following path:

app\code\Vendor\Extension\view\frontend\page_layout\2columns-left.xml

<?xml version="1.0"?>

<layout xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_layout.xsd">
    <update handle="2columns-left"/>

    <referenceContainer name="columns">
        <referenceContainer name="sidebar.main">
            <block class="Vendor\Extension\Block\Categorylist" name="category-sidebar" template="Vendor_Extension::category.phtml"/>
        </referenceContainer>
    </referenceContainer>
</layout>

2] Now you need to add category.phtml at the following path:

app\code\Vendor\Extension\view\frontend\templates\category.phtml

<?php
$category = $block->getEnableCategory();
?>
<h2 align="center">Category list</h2>
<?php foreach ($category as $categorydata) : ?>
    <?php
    $categoryid = $categorydata->getEntityId();
    $categoryFactory = $block->getCategoryName($categoryid);
    $categoryNameshow = $categoryFactory->getName();
    $categoryUrlShow = $categoryFactory->getUrl();
    ?>
    <div>
        <a class="category-link-show" href="<?php echo $categoryUrlShow; ?>" alt="<?php echo $categoryNameshow; ?>"
           title="<?php echo $categoryNameshow; ?>">
            <div class="category-show-cmspage">
                <div class="category-slide">
                    <div class="category-name-show"><?php echo $categoryNameshow; ?></div>
                </div>
            </div>
        </a>
    </div>
<?php endforeach; ?>

3] Now You Need to create Categorylist.php file at the following path:

app\code\Vendor\Extension\Block\Categorylist.php

<?php

namespace Vendor\Extension\Block;

use Magento\Catalog\Model\Product;

class Categorylist extends \Magento\Framework\View\Element\Template
{
    protected $_categoryFactory;

    protected $_storeManager;

    protected $_categoryNameFactory;

    public function __construct(
        \Magento\Framework\View\Element\Template\Context $context,
        \Magento\Catalog\Model\CategoryFactory $categoryNameFactory,
        \Magento\Catalog\Model\ResourceModel\Category\CollectionFactory $collecionFactory,
        \Magento\Store\Model\StoreManagerInterface $storeManager,
        \Magento\Framework\Registry $registry,
        array $data = []
    )
    {
        $this->_coreRegistry = $registry;
        $this->_categoryNameFactory = $categoryNameFactory;
        $this->_categoryFactory = $collecionFactory;
        $this->_storeManager = $storeManager;
        parent::__construct($context, $data);
    }

    public function getEnableCategory()
    {

        $category = $this->_categoryFactory->create()->setStore($this->_storeManager->getStore());
        return $category;
    }

    public function getCategoryName($categoryId)
    {
        $category = $this->_categoryNameFactory->create()->load($categoryId)->setStore($this->_storeManager->getStore());
        return $category;
    }
}

And that’s it for the day. Using these codes, you will be able to show the list of all categories with links at the sidebar on the category page of Magento 2. Feel free to implement these codes as per your needs. If you face any problem while doing so, then you can contact our Support team for help. We will be happy to help you.

Lastly, let us know what you feel about this article in the comment section below. Also, don’t forget to share this with your Magento partners and colleagues.

Happy Coding?

Click to rate this post!
[Total: 13 Average: 4.1]
Dhiren Vasoya

Dhiren Vasoya is a Director and Co-founder at MageComp, Passionate ?️ Certified Magento Developer?‍?. He has more than 9 years of experience in Magento Development and completed 850+ projects to solve the most important E-commerce challenges. He is fond❤️ of coding and if he is not busy developing then you can find him at the cricket ground, hitting boundaries.?

View Comments

  • Nice, Useful Script. But it show all categories (including Root & Default categories) in linear way(categories & subcategories). Would please provide some info to alter this in Parent Child way like below:
    Category 1
    -Sub category 1
    -Sub Category 2
    Category 2
    -Sub category 1
    -Sub Category 2

  • Hi Dhiren Vasoya,
    I tried follow your guide. But I can't see the category menu link in left sidebar at the category view page. Please, help me.

    • Confirm you create all the necessary file that is required for the extension other then just above files. And the same fie is not override into the extension or theme.

      • I created these 3 easy files and places them in the folders as described, but nothing is happening. can you please explain what "other files are necessary" for the extension?

        • Confirm you have implemented the above code properly and create other necessary files of the extension.
          Also confirm, on the category page our file is called.

          • Thanks for your reply. i did not see instructions on creating these files. can you provide the instructions?

          • That means the files you create for the extension like Registration.php. module.xml, composer.json

          • thanks for your reply,

            can you explain/specify:

            "...other necessary files of the extension.
            Also confirm, on the category page our file is called."

            i see no instructions for this
            thanks

    • Probably your Theme or any custom extension must be re-writing the things that's why its not show, you can debug this things by disabling all the third party extension or theme to get more idea,

Recent Posts

How to Add Tooltip in Checkout Shipping Field in Magento 2?

Hello Magento Friends, In today’s blog, I will explain How to Add Tooltip in Checkout…

3 days ago

How to Integrate and Use MongoDB with Laravel?

MongoDB is a popular NoSQL database that offers flexibility and scalability when handling modern web…

4 days ago

NodeJS | Callback Function

In NodeJS, callbacks empower developers to execute asynchronous operations like reading files, handling requests, and…

5 days ago

How to Show SKU in Order Summary in Magento 2?

Hello Magento Friends, In today’s blog, we will learn How to Show SKU in Order…

7 days ago

Best Colors to Use for CTA Buttons

The "Buy Now" and "Add to Cart" buttons serve as the primary call-to-action (CTA) elements…

1 week ago

Magento 2: How to Save Custom Field Value to quote_address for Multi-Shipping Orders

Hello Magento Friends, In Magento 2, the checkout process allows customers to choose multiple shipping…

1 week ago