Friday, August 28, 2009

How to make a personalized favicon :)

Since I learned how to make 'favicons', I thought I would post a little tutorial on how to make them for your site!

Favicons (blend of 'favorite' and 'icon') are the little logos you see next to the web address you are visiting. It's a great way to personalize your site or get your brand 'out there' :)

Here's how:

1. Make a logo in Photoshop (or other design software) and resize it to 16 by 16 pixels. Try to do the original in a square background so that when you resize, it shrinks to the right proportions. Also, make it simple. It is going to be r.e.a.l.l.y tiny, so a photo or letter works quite well. Save the 16x16 image as a .png.

2. You now need to make it into an .ico file, so import the .png to an .ico generator like this one here. Once it makes the file, click on 'download file' and save it to your computer.

3. Next, go to stashbox.org and upload the file you downloaded from the generator. You don't have to make an account to host files there, just click on 'upload or manage files'. After it uploads scroll down to 'HTML/Forum Codes' and look for the URL code.

4. Open a new tab and go to your Blogger layout, click 'Edit HTML', do a Ctrl F to find the tag that has 'head' between two pointy brackets <>
2 lines below it copy and paste this code in:
link href='image url here' rel='shortcut icon' type='image/vnd.microsoft.icon'/

Erase the part in green, and copy and paste URL code from stashbox in that place, add a pointy bracket <> after '/'. Then, 'Save Template'. You can 'View Blog' and see your little favicon by the address!

Did it work? If it did, I'd like to come see it! If not, let me know...hope I didn't forget any instructions :)

Have fun!

Allison

P.S. Stashbox.org is a clean site as far as I could see. It took awhile to find a free image hosting place that would take .ico files and not show off any terrible ads, and this is one that looked okay :) I found this tutorial on Cool Tips and Tricks

3 comments:

  1. Oh my gosh it worked! It looks really cool too. Thanks for the tut! :)

    ReplyDelete
  2. Yay! Had to check it out, and it looks great!!

    ReplyDelete
  3. Allison, I've just stumbled across your blog and love your work!

    ReplyDelete

Would you like to read interviews from Marvelous Photo-bloggers??