I’ve been noticing so many blogs lately that don’t have favicons so I thought I’d share a super quick tutorial in the hope to help someone out.
A favicon is the little dinky icon that shows up on each tab next to the title of the page. It helps to finish off your blogs identity and makes flicking between lots of tabs much easier for the reader.
If you use Blogger and haven’t changed yours yet, your viewers will just see the default Blogger B (far right). So here’s how to fix that:
First of all, decide what you’d like to change yours to. A mini logo? Just a colour? A small photo? Either way, your best bet is to start with something square to fit the space properly so try to crop whatever you decide on. Save it as a GIF, JPEG or PNG file.
Head to http://favicon-generator.org/ and “choose file” then “create favicon”. I’d also untick the “maintain image dimensions” box unless you’re trying to upload something that isn’t square.
On the next screen, click “download the generated favicon”. Next go to Blogger and click “layout”.
By clicking edit in the Favicon section, you should be able to choose the .ico file you’ve just downloaded. Click save in that window and then remember to click “save arrangement” in the layout window (the orange button).
You’re all done. You should have a snazzy new favicon to show off and give your blog that polished feeling! If you have any questions feel free to leave a comment and I’ll try to help.
Beeta says
Very helpful, thank you! More of these little tutorials would be great 🙂 x
Vicki Higham says
I’m glad you found it useful 🙂 x
gleepface says
I’ve been meaning to do this for ages, this post just reminded me! Thanks!
Elizabeth says
I had no idea! I shall have to remedy this on my blog. Thank you!
Janice Pattie says
This is just brilliant, thanks so much for posting it. Definitely need to get you more readers!
Vicki Higham says
Very kind of you Janice. I throw a little party every time my reader count goes up! X
Han says
If you don’t have blogger you can add it to your < head > with this 😛
< link rel="shortcut icon" href="favicon.ico" / > (remove the spaces before and after the crocodiles!)
http://en.wikipedia.org/wiki/Favicon#How_to_use
Vicki Higham says
Thanks Han 🙂