June 2, 2008

How to Customize Your Favicon in Blogger

18:11 Admin No comments

A Favicon is a custom icon for your blog displayed next to the URL’s of your sites and next to the page title in open tabs.

By default in blogger blogs, all the icons are set to Blogger’s favicon:

By performing the following steps you can replace the Favicon with your own.

  1. Select an icon of your own, you can get quite a bit of professional free favicons at Favicons R Us or you can create your own Favicon at favicon.cc.
  1. Next you’ll need to host the icon on a website. If your blog is on a custom domain you can upload your icon there or you can upload it on a free service, preferably on Google’s free web hosting service. Once you’ve uploaded the icon you can move to step 3. [Lets call the URL of the icon you have uploaded ‘FaviconURL’]
  1. Now log in to your Blogger control panel, go to the layout panel of the blog you want to customize. Select ‘Edit HTML’.
  1. Look for the “<head>” code (it’s somewhere on the top, if you can’t find it select ‘Ctrl + F’ and search for it.)
  1. Once you’ve found the location right after the “<head>” code paste the following code:

<link href=FaviconURL rel=shortcut icon>
<link href=FaviconURL rel=icon>

Icon Details

The icon should be preferably square – 16×16, 32×32, or 64×64, bigger sizes are supported but you wouldn’t want most of your webpage’s file size to be because of your Favicon. It would be best if you limit the file size of the Favicon to less than 15k.

Posted in: ,

0 comments:

Post a Comment

RSS FeedSubscribe