How to set logo in admin configuration tab in Magento 2
Hello Friends!!!
In this article, we will learn how we can add a logo in the admin configuration tab for our custom module.
To achieve the required result, we will follow the below steps:
1. We will create a CSS file named configtab.css inside the app/code/Vendor/Module/view/adminhtml/web/css directory.
.admin__page-nav.wk-config-tab-class._collapsed._show ._collapsible strong:before { content: ""; background: url(../images/configtab/logo.png) no-repeat scroll 0 0 transparent; width: 100%; height: 26px; display: inline-block; vertical-align: bottom; } .admin__page-nav.wk-config-tab-class._collapsed._show ._collapsible strong { font-size: 0; }
In the above CSS code, in background property, we have used logo image file URL. The logo.png is exist inside the app/code/Vendor/Module/view/adminhtml/web/images/configtab directory.
2. Now, we will add the .wk-config-tab-class CSS class in the class attribute of the tab tag in the app/code/Vendor/Module/etc/adminhtml/system.xml file as the following image:
Now, see the result in the following image:
Hope this will be helpful.
Thanks 🙂
Categories:
Magento 2
Tags:
add image in admin configuration tab add logo in admin configuration tab add logo in admin configuration tab in Magento 2.4 admin configuration tab How to add logo in admin configuration tab in Magento 2 How to set logo in admin configuration tab in Magento 2 image in admin configuration tag
View Comments
Comment or Ask a Question
Quick Links