Apparently this process has changed just a bit in the last year so I thought I'd update everyone on the new hottness. (Yes, that has 2 T's.)
Favicon: (short for favorites icon) A web designer can create such an icon and install it into a website. Browsers that provide favicon support typically display a page's favicon in the browser's URL bar and next to the page's name in a list of bookmarks.
1- Create your favicon
- Start out with the larger image that you'd like to transform into the favicon.
- Go to: http://www.favicon.co.uk/
- Click "Generate Favicon"
- Click "Download Your Favicon Here"
Sometimes it's just easier to take a screen capture of your homepage and crop part of your logo
Click "Choose File" and browse for the image you are converting. Choose your size (16x16)
2- Upload your image to your blog
UPDATE: Disregard the strike through
Use oogletoogle.com to host your image. Browse for your file and upload it. Click on "file name url" and copy/paste the URL to that page in a notepad document.
To do this you need to start a new post. You'll be keeping this post as a draft.
Click the photo icon to upload a photo.Find the .ico file that you downloaded from the favicon generator.Upload this photo with no formatting and large size.
4- Go to the Template tab at the top of your Blogger backend and edit it in HTML.
Scroll down to the close head tag and copy/paste the following code ABOVE the close head tag:
Don't forget to replace the "your image url here" with the URL you saved in your notepad document.
5- Save the template. (Republish if you are hosting the blog on your own server.)
6- Check out your new favicon when you go visit your blog. (You may need to hit Shift + Refresh if it is cached)
Here are a few blogs where we added a custom favicon to blogger. You can view the source if you want to see where we placed the code.
