How to change website favicon in Magento 2
Every company has their own logo which is unique and represents the type of interest of the specific company. The Favicon is a unique way to define your company and brand to online users. In this article, we will show you the way to replace your favicon in Magento 2 platform.
What is a favicon?
A favicon is a small icon that browsers display next to a page’s title on a browser tab or in the address bar next to its URL. Some web services and search engines also use the favicon.
The image size is generally 16 x 16 pixels or 32 x 32 pixels. A favicon image in the type formats such as ICO, PNG, JPG, and SVG are allowed.
A favicon is not something to be overlooked. It’s actually a critical thing for site recognition in a browser full of tabs and it’s a great opportunity to complete your branding.
Here is a full guideline to replace the favicon in Magento 2.2.x platform.
Step 1: Navigate to Content > Configuration
Firstly, you need to open Magento admin panel. On the Admin menu, you will tap the “Content” button. After that, find Configuration and click on this button. There is a Design Configuration site appeared.
Step 2: Design Configuration > Select Your Current Theme
The Design Configuration appears like below, it is very an easy tool to edit design-related rules and configuration settings by displaying the settings on a single page.
In this table, decide on which level you want to configure the favicon. In the Action column, click Edit in the corresponding row.
Step 3: Click to the HTML Head
Under Other Settings, expand the HTML Head section.
In the Favicon Icon: Click the “Upload” button to upload the small graphic image that appears in the address bar and tab of the browser.
Below are some other field descriptions:
Default Title: The title that appears at the title bar of each page when users can view in a browser. The default title is used for all pages so admin can replace it to be suitable for your company’s aim.
Title Prefix/Suffix: A prefix/suffix can be added before the title to create a two- or three-part title. A vertical bar or colon can be used as a separator at the end of the prefix to differentiate it from the text of the main title.
Default Meta Description: You can add the description providing a summary of your site for search engine listings and it should not be more than 160 characters in length.
Step 5: Save the process
When complete the steps above, save changes by clicking either button on the top right: Save and Continue to continue editing or Save Configuration to complete the process.
Step 6: See the result
Refresh the website to see your new favicon, that’s pretty fast, right?
This is the end of the tutorial of how to replace the favicon in Magento 2. Using your own favicon will help your customers easily distinguish your site and other sites when using the browser. In addition, a unique favicon can easily establish the customers’ credibility thanks to the consistent branding elements.
A graphic design and copywriting enthusiast.
Marketing Executive | Content Manager