Fix For Blogger Favicon Visibility in Internet Explorer (IE)

Favicon is a 16 X 16 small graphic icon that appears in your browser address bar next to a website domain name. It is also known as a shortc...

favicon-conflicts-in-IEFavicon is a 16 X 16 small graphic icon that appears in your browser address bar next to a website domain name. It is also known as a shortcut icon, website icon, bookmark icon or even a URL icon. Its gives branded look to your blog and makes it stand out. By default in all blogger blogs you see a small orange icon blogger favicon that shows next to all subdomains with BlogSpot as the extension.

Even those who have purchased domains see that orange icon as the default favicon. Most of your might have observed that your custom favicon displays in both Firefox, chrome and other major browsers but you can not see favicon appearing in Internet explorer instead you see the same orange icon. Blogger also introduced a Favicon widget using which you can replace the default favicon with a logo image of your choice but unfortunately most of you are still confused on why you can not make the icon working in IE browser. In today's tutorial we will know what causes all the trouble and will successfully upload a favicon of our choice as your blog's brand logo.

How were Favicons previously used?

In blogger you would insert the following HTML code just below the opening <head> tag to make the icon appear:

<link rel="icon" href="LOGO Link in gif format" type="image/gif" />

or this:

<link href='LOGO link in .ico Format' rel='shortcut icon' type='image/x-icon'/>

By inserting the logo links you can easily make the icon appear on the address bar. But this method wont make the icon appear in IE because Internet Explorer always fetches the favicon from the root domain.  For example in our case IE will look for the favicon at the following address:

www.MyBloggerTricks.com/favicon.ico

3 Reasons Why IE doesn't accept the Icon?

  1. IE wont accept the icon if it is stored on your picasa album or in any other image hosting service or even if it is stored in any of your sub domains.
  2. It will also not accept the icon if its not stored in .ico format
  3. or if its size is greater than 16 X 16 pixels.

These are the three reasons that explain why your favicon does not show in Microsoft's browser and why IE conflicts in this case. Lets now fix this issue of no visibility and make things work just fine!

How To Upload Favicon Correctly in Blogger?

We will use the same widget that blogger provides but with correct requirements. Luckily the widget provided by blogger will automatically convert your logo into a .ico format even of its original format is gif or jpeg. So you don't need to worry in this case. Follow these steps

  1. Create a 16 X 16 pixels (or a square size ) logo icon for your blog either using Photoshop or any of the 30 Web tools we introduced.
  2. Note you must rename your icon anything other than favicon. In our case we named it fav. In order to force replace the default icon with yours you must save it with a different name else it wont display in any of the major browsers.
  3. Now go to Blogger > Layout > Page elements
  4. Click the edit link next to Favicon at the top-left corner

change-favicon

     5.  Confidently upload your logo using the browse button and hit Save

     6.  Clear your browser cache and visit your blog in both Firefox, Chrome and finally IE8+ to see a beautiful website icon just next to your domain inside the address bar!

Need help?

The steps are self explanatory and easily implementable. If incase you got yourself into a trouble just post your query and we would love to sort out your problem. I just hope with this IE fix, your free blogger blogs will get a whole new dressed up look. Happy blogging. Peace and blessings pals. :)

COMMENTS

Name

Affiliate Marketing,12,Announcement,34,Bing,9,Bitcoin,38,blog,7,Blogger Resources,42,Blogger Templates,4,blogger tricks,156,Blogging ethics,69,Blogging tips,198,Bugs and Errors,34,Copyright Violation,9,CSS and HTMLTricks,95,Designs,8,drop down menu,7,eBook,12,Email Marketing,7,Events,30,Facebook,30,Facebook tricks,49,Google,157,Google AdSense,42,Google Analytics,7,Google Plus,51,Google Plus Tricks,38,Guest Posts,112,home,2,How To,77,JSON Feeds,25,Kitchen Recipes,2,Label Based Sitemap Themes,1,Make Money Online,108,Marketing,16,MBT Blogger Templates,7,Menus,1,News,146,Pages,1,Posts,10,presentations,15,Responsive,10,Reviews,7,SEO,305,Settings,6,Shortcode,15,Sitemap Themes,1,Social Media,155,Templates,1,Tips,2,Tools,1,Traffic Tips,80,Video,19,Web Designing,62,web hosting,18,Webmaster Tools,97,Widgets,199,wordpress,26,
ltr
item
SEO and SEM Guide For Bloggers: Fix For Blogger Favicon Visibility in Internet Explorer (IE)
Fix For Blogger Favicon Visibility in Internet Explorer (IE)
http://lh5.ggpht.com/-hIfBKXbeDUE/T76GU1LzudI/AAAAAAAAGg8/p-H72b83LU8/favicon-conflicts-in-IE%25255B5%25255D.gif?imgmax=800
http://lh5.ggpht.com/-hIfBKXbeDUE/T76GU1LzudI/AAAAAAAAGg8/p-H72b83LU8/s72-c/favicon-conflicts-in-IE%25255B5%25255D.gif?imgmax=800
SEO and SEM Guide For Bloggers
https://www.experiencelab.info/2012/05/fix-for-blogger-favicon-visibility-in.html
https://www.experiencelab.info/
https://www.experiencelab.info/
https://www.experiencelab.info/2012/05/fix-for-blogger-favicon-visibility-in.html
true
2959477579779989044
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS PREMIUM CONTENT IS LOCKED STEP 1: Share. STEP 2: Click the link you shared to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy