Adding a Favicon to a SharePoint website for all browsers ( Especially for IE )

While working with SharePoint customization, I got a requirement to change the favicon image. I have never changed favicon image before working on SharePoint 2007 and SharePoint 2013. By default Microsoft people will have following favicon images for SharePoint 2010 and SharePoint 2013.

By default it will be located in C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\IMAGES and C:\Program Files\Common Files\microsoft shared\Web Server Extensions\15\TEMPLATE\IMAGES folders.

If we visit images folder (Images folder following the link given below) we will find one of these icon file on the name of ‘favicon.ico’ rename it like ‘faviconA.ico’ etc.

Now visit the link http://favicon-generator.org/ upload your favicon file but make sure your icon background must be transparent before uploading (We did this because of IE).

Download your favicon.ico file and put it into the images folder (Images folder following the link given below).

Open SharePoint Designer and then click over ‘Images’ folder upload your file there too. Now URL of the favicon will be looks like http://www.abc.com/images/favicon.ico

Now open your master page paste this code just above the </head> tag.

<link rel="shortcut icon" href="http://www.abc.com/images/favicon.ico" type="image/x-icon">

<link rel="icon" href=" http://www.abc.com/images/favicon.ico" type="image/x-icon">

Publish your master page after uploading master page in master page and layout gallery.

Clear your browser cache as well as clear your website cache close your browser and then visit your website you will come up with your new favicon. (Note: some time an IIS required if still your favicon is not displaying).