Hello! Welcome to Tech Ankur
If you are looking for How To Add Hd Favicon In Blogger. then this post is just for you.
If you want to set HD favicon on your blogger blog then you have come to the right place, you guys need a code to set HD favicon in blogger blog
Now let's start learning
What is a Favicon?
A favicon is a small, 16x16 pixel icon used on a web browser to represent a website or web page. Short for "favorites icon", favicons are typically displayed on tabs at the top of web browsers, but they are also found in your browser's bookmarks bar, history, and search results, along with page URLs.
How to set HD favicon in blogger
- Open the code in notepad
- If you are using android you may open in quick edit application
<!--[ Favicon by- techankur.xyz ]-->
<link expr:href='data:blog.homepageUrl + "/favicon.ico"' rel='icon' type='image/x-icon'/>
<link href='https://blogger.googleusercontent.com/img/b/xxxx.png' rel='apple-touch-icon'/>
<link href='https://blogger.googleusercontent.com/img/b/xxxx.png' rel='apple-touch-icon' sizes='57x57'/>
<link href='https://blogger.googleusercontent.com/img/b/xxxx.png' rel='apple-touch-icon' sizes='72x72'/>
<link href='https://blogger.googleusercontent.com/img/b/xxxx.png' rel='apple-touch-icon' sizes='76x76'/>
<link href='https://blogger.googleusercontent.com/img/b/xxxx.png' rel='apple-touch-icon' sizes='114x114'/>
<link href='https://blogger.googleusercontent.com/img/b/xxxx.png' rel='apple-touch-icon' sizes='120x120'/>
<link href='https://blogger.googleusercontent.com/img/b/xxxx.png' sizes='144x144'/>
<link href='https://blogger.googleusercontent.com/img/b/xxxx.png' rel='apple-touch-icon' sizes='152x152'/>
<link href='https://blogger.googleusercontent.com/img/b/xxxx.png' rel='apple-touch-icon' sizes='180x180'/>
- Here you will see various image sizes like
57x57,
192x192,
etc. - Go to Image Resizer and resize your logo to the following sizes
192x192
57x57
-
72x72
76x76
114x114
120x120
144x144
152x152
180x180
- After resizing image go toBlogger Dashboard
- Click on New page
- Click on the image icon at the top and import all sizes of images
- Caption images by their size to remember the size of the image
- Publish page
- Click on view
- Copy link address of image
- Replace image links from html code
- After replacing all image Link
- Copy all code
- Go to blogger dashboard
- Click on theme
- Click on Edit html
- Find
<head>
- Paste the code below
<head>
- Click on Save Theme
That's done!
If you face any problem, then join our tech ankur group
Copyright:
Tech Ankur