In this tutorial, we will guide you on how to change some of the basic Magento design settings and customize the look of your Online Store. We will show you how to change the default Magento favicon (the logo which appears in the browser title bar), how to customize the default page title, how to customize your store logo and how to edit the footer copyright notice.
In order to begin, please log in to your Magento Admin Dashboard and navigate through the left menu bar to Content > Configuration.
Once you access the “Design Configuration” page, you will need to select one of the listed website view options depending on what level you would like to perform the design changes.
Once you make your decision, please click on the corresponding “Edit” button in order to open the configuration page.
Now that you are on the right page, please scroll down to “Other Settings” and expand the “HTML Head” section. Favicon icons are generally 16 x 16 pixels or 32 x 32 pixels in size. Magento allows the use of the following file formats for favicons: .ico, .png, .gif, .jpg, .jpeg, .apng, .svg. Please note even though these file types are supported by Magento, they might not be supported by all browser types. It is recommended to hold to the .ico file format as it is the most commonly used and widely supported. You can always use a file converter tool to generate or convert your file into .ico format.
Next to the “Favicon Icon” you will see two buttons which will allow you to either upload a file from your local computer or select a file from your Magneto gallery and override the default Magento favicon.
Under the following “Default Page Title” field you can enter your custom default page title which will appear into the browser title bar for all pages that do not have a strictly defined page title.
As you have probably noticed, next to each of the settings you have a “Use Default Value” button which will allow you to override your current configuration and switch back to Magento’s default favicon and default page title.
Once you are ready, please click on the “Save and Continue” button. Afterward, please make sure to clean the Magento cache by going to System > Cache Management > Flush Magento Cache and check the result which should be similar to the screenshot example below.
If you are satisfied with the result, you are all set to continue further.
Now, please expand the following “Header” section where you will be able to customize your store logo and edit the welcome message which appears in the header of the page.
The default store logo, its size, and location are determined by the theme you are using for your Magento store. In case you are not sure about the exact size of the logo you can always double-check it by accessing your web page in a browser - right-click on the logo image and select the “Inspect” option. Magento supports the following file types for store logo images: .png, .gif, .jpg, .jpeg.
Similarly to the previous example, here you will also be able to either upload the logo file from your local computer or select one from your Magento gallery and override the default store logo.
Under the following two “Logo Attribute Width” and “Logo attribute Height” fields you can define the width and height of your logo image in pixels.
From the “Welcome Text” field you can customize the default welcome message (“Default welcome msg!”) which appears in the header of the page.
Under the last “Logo Image Alt” field you can enter an alternative text which will appear in case the logo image cannot be displayed for some reason.
Once you are ready, please click on the “Save and Continue” button. Afterward, please make sure to clean the Magento cache by going to System > Cache Management > Flush Magento Cache and check the result.
Now you should be ready to move forward and edit the Copyright Notice.
As a Magento user, you have probably noticed the default Magento Copyright message which appears in the footer of every page. In this section, we will show you how easy you can update it to your custom copyright notice.
Please, expand the following “Footer” section in order to list all its options. What you are looking for here is the “Copyright” field where you will need to enter the text you would like to be displayed on your Magento store.
Something else worth to be pointed is the “Miscellaneous HTML” field where you can enter miscellaneous scripts that needs to be placed just before the closing <body> tag. That will allow you to directly upload the script to the server and avoid all the going off to put it into the template file.
Once you are ready, please click on the “Save and Continue” button. Afterward, please make sure to clean the Magento cache by going to System > Cache Management > Flush Magento Cache and check the result.
Voilà! Now you have your custom Favicon, Store Logo and Copyright Notice successfully configured. We truly hope you have found our guide useful and easy to follow. If you have experienced any kind of difficulties you are always welcome to contact our Support Team for further instructions.
Sebahat is a young and bright woman who has become an invaluable part of our team. She started as a Customer Care Representative, mastering that role and, along the way, growing into a tech-savvy individual who is well acquainted with every support layer of the company. Driven by her aim to improve our customers’ experience constantly, she is committed to enhancing the extraordinary support we deliver.