Tired of the orange color “B” favicon appearing on the browser address bar for your blogspot blog? Well; if you are like me who has taken enormous effort to customize your blogspot site to make it distinguished from the generic blogger templates, and hosted your site on your own domain, I’m sure you might be wondering how to add your own site favicon to the address bar of the browser. favicon is a small, 16x16 image that is shown inside the browser's location bar and bookmark menu when your site is called up. It is a good way to brand your site and increase it's prominence in your visitor's bookmark menu.

It’s easy as ABC. Let me guide you through it step by step.

First create the image you want to use as your favicon. Make it perfectly square. You can design it as a larger picture but then resize it to the size of 32 X 32 pixels. Save it in PNG format.

Upload your PNG favicon to your web server or to an image hosting service like Flickr, Photobucket or Picasa.

Now get the exact URL of your image.

Now login to your blogger account and go to “Layout” and click on “Edit HTML”. Tick on the box, “Expand Widget Templates”. Look for the tag..

Below this tag, go and paste a new line as below.

replace "Your_Favicon_URL" with the actual URL where your Favicon is hosted.

Once you do this, save your template and check your blog on live. Changing the favicon of a blogger/blogspot site is that easy!

Here's a screen shot to see where to locate this code.

[File under "blogger tips"]


Kirigalpoththa said... @ December 10, 2009 at 9:05 AM

Thanks very much! :)

Peter Marion said... @ April 17, 2013 at 11:25 PM

Get more business strategy game help tips that aims to teach on how to Win business strategy game and gives Glo-Bus advice from a former Glo-Bus Industry Champion by visiting www.BSGtips.com.

Post a Comment