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 Integrate ChatGPT with Laravel Application?

In this guide, we'll explore how to integrate ChatGPT, an AI-powered chatbot, with a Laravel…

1 day ago

What are Net Sales? How to Calculate Your Net Sales?

In the world of business, understanding financial metrics is crucial for making informed decisions and…

4 days ago

Magento 2 Extensions Digest April 2024 (New Release & Updates)

Welcome to the MageComp Monthly Digest, where we bring you the latest updates, releases, and…

4 days ago

The ABCs of Geofencing: Definition, Features and Uses

In this era, businesses are always on the lookout for ways to engage with their…

5 days ago

How to Delete Product Variant in a Shopify Remix App using GraphQL Mutations?

Managing a Shopify store efficiently involves keeping your product catalog organized. This includes removing outdated…

5 days ago

6 Innovative Tools Revolutionizing E-Commerce Operations

E-commerce has transformed the way consumers shop for products and services and interact with businesses.…

1 week ago