What is a Favicon?
The next thing we’re going to do is something fun, we’re going to create and add a Favicon to our Thesis site. A favicon is a bookmark icon. My “Gal” right here is a Favicon, this four-square thing is a Favicon. If you look at your bookmarks bar for example, you can see there’s a Favicon over here and a Favicon there for these different bookmarks I have.
Adding a Favicon is a way of essentially branding yourself and putting a little icon before a Bookmark and also a way of having that icon appear. A Favicon is a very easy thing to create, I’m going to show you how to create that and how to add it to your site.
Create Favicon Using Favicon Generator
The way to create a Favicon is from my link here, “Favicon Generator”. If you click on that, it will take you over here to favicon.cc and you could take a paintbrush, paint, color and draw or you can import an image. For example, I could import my head shot and upload it. You can see it has taken this image of mine and it has pixelated it to the point where it seems it has interpreted it.
You can see that’s actually not a bad representation of what it really looks like if it was reduced. That’s what it would look like if you put a head shot in there. I’m going to put an image with this girl in it and we’re going to have that be the icon, so we’re going to pick a different image. Import the image, choose a file, upload that and then there we’ve got its extrapolation.
What we have to do is come here and say, “Download Favicon”. If we click that, it downloads to the page. From inside of a Thesis, Favicon Uploader I can select my Favicon that is under Downloads. You could also have put something else besides the Favicon, you could have put a PNG or you could have put a different image type in here but the favicon.ico image is most consistently applied across browsers so this is the one you definitely want to use.
If we refresh this, we’re going to see her up there, right now. Now you’ve got the Favicon added to your page.