Blog

How to change Theme Logo in Magento2

Method 1: If logo is with logo.svg

In the Magento. the default format and name of a logo image is logo.svg.

  • Put a logo.svg image in app/design/frontend/<vendor>/<theme_dir>/web/images directory
  • Remove folders present in pub/static/frontend && var/view_preprocessed/pub/static/frontend
  • Run below commands:
php bin/magento se:s:d -f

It is displayed in your store page header once the theme is applied.

Method 2: Can we use a logo file with a different name and format?

Yes, but you might need to declare it.

Let’s see it,

  1. Put your logo in app/design/frontend/<vendor>/<theme_dir>/web/images directory
  2. Create default.xml  in app/design/frontend/<vendor>/<theme_dir>/Magento_Theme/layout/

For example, if your logo file is my_logo.png sized 150 x 150px, you need to declare it as follows:

<?xml version="1.0"?>
<!--
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */
-->
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="logo">
            <arguments>
                <argument name="logo_file" xsi:type="string">images/book.jpg</argument>
                <argument name="logo_img_width" xsi:type="number">148</argument>
                <argument name="logo_img_height" xsi:type="number">43</argument>
            </arguments>
        </referenceBlock>
    </body>
</page>

After this if, your theme is been applied then

  • Remove folders present in pub/static/frontend && var/view_preprocessed/pub/static/frontend
  • Run below commands:
php bin/magento se:s:d -f && php bin/magento c:f

and refresh your browser to see new logo.

 

Happy Learning !!

Thank You !!

Magento2 Interview Preparation

Leave a Reply

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