0

I have a png image and I want to replace the default icon of the custom menu in the admin panel in Magento. I tried to other articles who are customizing their code in the app/code/Vendor/Module/ folder but that was not working for me so please suggest any simple solution.

2 Answers 2

1

Try to this way ..

You need to create adminhtml.css file to set our custom style and link for icon and replace icon.png link with your icon URL.

we have to link our CSS file by creating default.xml file at following path.

app\code\Vendor\Extension\view\adminhtml\layout\default.xml

<?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">
    <head>
        <css src="Vendor_Extension::css/adminhtml.css"/>
    </head>
</page>

app\code\Vendor\Extension\view\adminhtml\web\css\adminhtml.css

.admin__menu .level-0.item-menu_id > a:before {
    content: url('../images/icon.png');
}
li#menu-vendor_extension-menu_id > a > span {
    display: none;
}

then run some commands

rm -rf var/view_preprocessed/*
rm -rf pub/static/adminhtml/*
php bin/magento setup:static-content:deploy
1
1

We have 2 ways to customize the menu logo in admin.

  1. Custom by css
  • Create file admin-icon.css in module app\code\Vendor\Extension\view\adminhtml\web\css
  • Add image logo in module. Ex: custom-logo.png
  • Create an xml file in the module and declare the newly created css file in that xml file.

enter image description here

  • Contents in the css file.

enter image description here

  • ".item-menu_id" is the outer class of the icon.

  • Run command

    rm -rf var/view_preprocessed/* rm -rf pub/static/adminhtml/* php bin/magento setup:static-content:deploy

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.