How to fix low resolution favicon problem on blogger

Hi, welcome back to blogging bador, in this article we will talk about how you can fix the low-resolution problem of blogger favicon. Blogger support maximum 100px * 100px favicon but after you add the favicon it's convert into 10px * 10px.

If you see your favicon by making bigger you see the favicon it's blurry. This problem is shown for the low resolution but we haven't got any way to fix these issues. In this article how you can install any high-resolution favicon on blogger. The maximum pixel of favicon on the blogger is 100px.

Table Of Content

1.Why high-quality favicon
2.How to add high-quality favicon on blogger
3.Conclosing

Why high-quality favicon

Favicon is your site identity, if you use firefox and opera browser then you see when you add the blog in bookmark the favicon looks large on the front page and the favicon looks dull and low resolution.

Blogger does give the right to upload high-quality favicon but we can use high-resolution favicon by a trick.

How to add high-quality favicon on blogger

To make your blog favicon high-quality follow all the steps of this section. On the blogger theme, there is two types of code available to show the favicon on the browser window and other where. See the below code to get an example of both code:

<link expr:href='data:blog.blogspotFaviconUrl' rel='icon' type='image/x-icon'/>

<link href='/favicon.ico' rel='icon' type='image/x-icon'/>

Some developer uses the first code and some developers use the second code. Both codes work is the same. The first code is made by the blogger conditional tag and the second code make by the URL directory.

First Code

First search for the favicon code I am already giving you now you see the first code then follow the below steps.

First, remove the code from your theme then upload your high-quality favicon on post editor then copy the URL.

<link href='img_url_here' rel='icon' type='image/x-icon'/>

Now add your uploaded favicon URL on the img_url_here after you add the URL then simply add the code before <head> tag.

Now save your theme.

Second Code

If you get the second code then there are some easy steps for you, follow the below steps to add high-quality favicon on your blogger blog.

If you get the second code then upload your favicon on the post editor first then copy the image url after then just replace your image url with the /favicon.ico .

Now save your theme and enjoy it.

Conclosing

This article about how you can fix the low resolution favicon problem. I'm trying to tell how you can fix now if you face any problem with this tutorial then please comment down below. You can check out your other articles and thanks for with us.

BookBD

Monday, October 5, 2020