How to Change Default Admin Logo in Magento 2
In the enhancing world of eCommerce, creating a strong, positive perception of a store is one of the most crucial aspects. A logo is one such aspect that directly affects the branding of the store and clarifies precisely what makes you different.
The admin panel of a default Magento 2 displays its logo in the admin login page and backend menu as shown below image:
- Admin Login Page:
- Admin Backend Menu:
Though Magento 2 does not provide any built-in feature to change the default admin logo, a developer have to do it manually.
Magento 2 store owner mostly prefers to change default admin logo in Magento 2 for branding purposes. Also you can upload SVG image in Magento 2 custom module to enhance visual content.
For example, your store sells CMS extensions, i.e., Magento 2. For that, it would be better if you manage to provide a personalized demo to your customer that allows them to explore the features of your extension.
In such a scenario, use the below method and change the default logo of Magento to your brand logo.
Moreover, you may also need to allow multiple admin login in Magento 2 to administer the store better and divide the workload for more efficiency.
Method to Change Default Admin Logo in Magento 2
-
For the Admin Login Page:
Create an admin_login.xml file at view/adminhtml/layout/
|
1 2 3 4 5 6 7 8 9 10 11 |
<?xml version="1.0"?> <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="admin-login" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <body> <referenceBlock name="logo"> <arguments> <argument name="logo_image_src" xsi:type="string">images/Meetanshi.png</argument> </arguments> </referenceBlock> </body> </page> |
The admin login page displays like:
-
For the Default Logo in Backend Menu
Create a default.xml file in your custom module at view/adminhtml/layout/
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<?xml version="1.0"?> <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="admin-1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <body> <referenceContainer name="header"> <block class="Magento\Backend\Block\Page\Header" name="logo" before="-"> <arguments> <argument name="show_part" xsi:type="string">logo</argument> <argument name="edition" translate="true" xsi:type="string">Community Edition</argument> <argument name="logo_image_src" xsi:type="string">images/Meetanshi.png</argument> </arguments> </block> </referenceContainer> </body> </page> |
After applying the above code, the updated logo in the default backend menu will look as shown in image:
Easy! Isn’t it?
Any doubts? Do mention them in the Comments section below.
I would be glad to help you out.
Also, please share the solution with Magento Community via social media.
Thank you.
Related Post:
2 Comments
HOw we can add path of media to this logo or how we can make dymnamic logo
Hello Rajnikant,
One can’t add the dynamic Path of image in the Xml file.
You need to put image in your extension under view/adminhtml/web/images folder or in pub/static path
Thank You