Favicon is nothing but a short form of favorite icon. Favicon is always displayed before the URL in browser address bar, on tabs of browser windows and on the bookmark lists. Favicon gives a pro look to site or weblog and if your site has unique Favicon then it gets easy to remember the site. So, how to create a Favicon?
Here’s simple tutorial to create a Favicon:
1. Firstly, you have to create an image of pixel size 16 x 16. Making such small sized image is a difficult task to do but you can use any image editing tool available in the market and design a perfect Favicon for site or blog.
2. Adobe Photoshop is great tool to create a nice Favicon. Create an image with Photoshop, keeping in mind that it should be clearly visible when you resize it. Save this file as Favicon.ico
3. If you are not aware of Adobe Photoshop then you can use MS Paint or any other web tools. It’s easy to create a Favicon of your choice with the help of simple tools. Save the created image in JPEG format and convert it into .ico format using “JPEG to ICO converter”.
4. Upload Favicon.ico file in root directory of control panel of website where index file is placed.
5. Website holders should change their header as shown below:
<link rel=”shortcut icon” href=”/favicon.ico” type=”image/x-icon” />
Add this code in <head></head> tags. This code will work if Favicon is situated in root directory.
6. For bloggers, make sure the path given in the codes is similar to file location. If in case blog doesn’t have facility of Favicon just follow step 5.
7. Follow all steps as stated above and then check website/blog in new browser window. Voila! Your website is ready with new Favicon.
8. Still not convinced with the new Favicon, you can always make changes in it to look attractive and unique.
For creating an animated Favicon just check this out: http://www.animatedfavicon.com/
[...] How to Create a Favicon? [...]
I am using free tool at animatedfavicon.com. This one works great and its fast
Thanks for sharing.
I am using free tool at animatedfavicon.com. This one works great and its fast
Thanks for sharing.
[...] of changes in all it’s products and services. From launching a new browser to adapting a new favicon for it’s super-search portal. While the Chrome browser is proving to be a huge hit among web [...]
[...] you don’t know anything about favicon then you can refer our simple tutorial to create a favicon for website, which will give you a perfect idea of favicon and its installation process. However, adding a [...]
thanks man, actually the most difficult thing about favicon is the icon idea itself. yeah, it takes me about 1 day to think about it, ha22. But i want to say good job, this is really nice article. I want to ask you also, can you give some explaination about changing the thesis frame size, yeah the picture frame. i have googled it for long time but i cannot find it. I think it is easy for you… Thank you BTW
Picture frame? I didn’t get you. Could you please elaborate your doubt?
I mean the frame picture, like in thesis multimedia box frame, like Posting Picture frame, or like the posting thumbnail picture like in the teaser. If you are thesis user you may know that thesis can make frame in the picture that usually gray color.
You can find the setting in Thesis Option menu, Post Images and Thumbnails and you can see the setting about Add a frame to post images.
I want to ask you how to modify the size because i want to make it very little.
Thank you for responding my comment. I know you can help me about this little question. Thank u
Add this code in custom.css file:
.custom .wp-caption {border-width: 0; padding: 0; }sorry man, but this is not working well. I want to ask what is the id wp-caption mean?
It should have worked properly. BTW, this function is used to modify the picture frame.
I will try to find the solution of this problem. If you find something, do let me know.
thanks man, actually the most difficult thing about favicon is the icon idea itself. yeah, it takes me about 1 day to think about it, ha22. But i want to say good job, this is really nice article. I want to ask you also, can you give some explaination about changing the thesis frame size, yeah the picture frame. i have googled it for long time but i cannot find it. I think it is easy for you… Thank you BTW
i don’t know but it shows no difference. the frame, or border still there. thank You BTw
where can i find out all thesis id and class list, so i can modify it myself. is there any? just asking..
Check CSS file.