Image Map

Thursday, July 5, 2012

Tutorial - Make your own Favicon (instead of Website Wednesday)

Now I know this is something that lots of people already have but to tell you the truth, I was feeling a little left out! So I thought "Brooke. You are getting ok at the internet techy stuff. Why don't you try and work it out?"


So here is a quick outline of how I did it! I thought it was fairly straight forward. Apologies for the extra large pictures but I thought the print was a little hard to look at.


1. I used http://www.favicon.cc/ . Choose Import Image. Its a good idea to know which image you want. 

 2. For mine, I copied the image of the button from my blog and saved it as an image (not the code!) before I did this step. Choose your file to upload. The second thing I circled was keep dimensions and I did this because my original image was a square. But you might like to play around with it if you have a different shaped image. Then click upload!
 3. Fingers crossed, your page now looks a little like this. This is your pixelated image. Now if you want to play around here you can change colours etc but I just stuck with what I had. Boring I know hehe.
4. Don't get tricked on the next step. Underneath your pixel picture you will need to scroll right down. There is where you find a preview of your Favicon and the button to download. It will give you a file extension of .ico

5. now the fun part - putting it on your blog! You will need to go to your layout to edit. Find the little gadget that says Favicon and click Edit

6. Choose your favicon file. You should see it pop up after it has uploaded to the page.
7. If it doesn't appear on the blog sidebar or on other people's blog sidebars, then you will need to clear your cache/ browsing history. I am using Google Chrome so I go to the spanner tool, click Tools and the choose Clear Browsing Data. In Internet Explorer, you would be looking for the same thing. Now refresh and have another look. You should have success!!!

I hope you have found this helpful and look forward to seeing your new favicon pop up in my sidebar :)





11 comments:

  1. Ooh I love this tutorial!! I didn't know how to do that! Thanks for sharing! :)
    Lisa
    Learning Is Something to Treasure

    ReplyDelete
  2. So glad I found your blog!!! I just started blogging, thanks for the inspiration :)

    http://teacherificfun.blogspot.com/

    ReplyDelete
  3. This has been the easiest explanation of how to make a favicon, thanks!
    I have given you an award! Come over to my blog to pick it up! =)
    Vanessa
    Kindergarten Schmindergarten

    ReplyDelete
    Replies
    1. Thanks Vanessa. Look forward to seeing yours

      Delete
  4. I just awarded you two awards. Come by and claim them at www.skippersjungle.blogspot.com :)

    ReplyDelete
  5. Hi! I’m one of your newest followers! I nominated you for two awards. Stop by my blog to pick them up!
    Patti
    pattib203@yahoo.com
    Primary Pizzazz

    ReplyDelete