Quick & Dirty: Change the Icon in the Browser Tab & Address Bar for a SharePoint Site

We had a request to change the icon in the browser tabs and address bar for a SharePoint site from the “Weeble People” default icon to our organization’s logo. This logo is round, and the user requested that any white space around the logo be made transparent, similar to the Internet Explorer default icon.

I’m no branding expert. The fact that the change must be replicated on all WFEs makes me guess that there is likely a more elegant solution using CSS and master pages and other web designer magicalness. And glitter. Lots of glitter.

Anyway, here are the steps to an admin hack that got the job done:

  1. Create a favicon ico file from your logo. A free generator (http://www.favicon.cc ) can create an ico file from other picture file formats (jpg, png, etc). Be aware that the number of pixels is limited, so a scaled down, less detailed logo works best.
  2. After uploading your file, you can use the Transparent Tool to remove any undesired background.
  3. Name your new file favicon.ico.
  4. Locate the existing favicon.ico file in the 14 hive:

C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\IMAGES

  1. Rename the existing file and copy your new favicon.ico file to this location.
  2. Repeat the file renaming and pasting on each WFE server.
  3. Wait.
  4. Wait. Seriously, it takes a bit for the change to show up. Clearing your browser history (including unchecking the IE option to retain data from favorite sites) and restarting IIS may help, but it still took up to an hour in my environment. [Anyone with suggestions to speed this up? I’m all ears!]

Note: This changes the icon for the root site and all sub sites.

Advertisements

About Joy Lavigne (Adkins)

SharePoint Administrator for a mid-sized organization. Frequent speaker at SharePoint Saturday events. Teller of terribly corny jokes. View all posts by Joy Lavigne (Adkins)

7 responses to “Quick & Dirty: Change the Icon in the Browser Tab & Address Bar for a SharePoint Site

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: