Back to Top

Create a Custom Tab on Category Edit Page in Admin Panel of Magento 2

Updated 15 August 2018

Hello Everyone! Today we are going to learn that How to add a custom tab on Category Edit Page in Admin panel of Magento 2.

Step 1:  create category_form.xml at Vendor/Module/view/adminhtml/ui_component folder and add following code to it-

<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
    <fieldset name="custom_category_tab" sortOrder="80">
        <settings>
            <collapsible>true</collapsible>
            <label translate="true">Custom Category Tab</label>
        </settings>
        <container name="custom_tab" sortOrder="180">
            <htmlContent name="html_content">
                <block name="custom_category_block" class="Vendor\Module\Block\Adminhtml\Custom\Tab"/>
            </htmlContent>
        </container>
    </fieldset>
</form>

Step 2: Create Tab.php at Vendor/Module/Block/Adminhtml/Custom folder and add the following code to it-

<?php

namespace Vendor\Module\Block\Adminhtml\Custom;

class Tab extends \Magento\Backend\Block\Template
{
    protected $_template = 'catalog/category/tab.phtml';
    
    public function __construct(
        \Magento\Backend\Block\Template\Context $context,
        array $data = []
    ) {
        parent::__construct($context, $data);
    }
}
?>

Final Step: Create the Template file tab.phtml at  Vendor/Module/view/adminhtml/templates/catalog/category folder, and add the content that you want to display in the custom tab.

Once you are done, it will look like this –

Searching for an experienced
Magento 2 Company ?
Find out More

This is all for now. Hope this will help.

For any doubts, you can comment below 🙂

. . .

Leave a Comment

Your email address will not be published. Required fields are marked*


Be the first to comment.

Back to Top

Message Sent!

If you have more details or questions, you can reply to the received confirmation email.

Back to Home