- How To Put An Icon On Your Browser URL Address Bar Favicon.ico
this tutorial will show you how to put a little icon on your browser whether it is internet explorer firefox chrome and other browsers on the address bar , Last Updated: Sun Jun 14, 2020
Sun Sep 03, 2006
Have you ever noticed that when you visit some web site, there is an icon small (little) image that shows (appears) at the top of your browser?
If you have, today you are going to learn how to install an icon picture for your web site, so when users visit your website, you can put your logo. Even better when a visitor bookmarks your url, the browser automatically saves in their favorites to identify your site.
Here is how to do this:
1. If you have windows, open paint. You can find it in:
Start > Programs > Accessories
2. Set the dimensions to 24x24 pixels: in Image > Attributes (Control - E)
3. Set Width to 24 and Height to 24 and Click Ok.
4. To help you create and edit your image better, zoom paint to the highest zoom which is 800%.
To do this, go to View > Zoom > Custom and Select 800%
5. Create your logo or whatever you want your icon to look like:
6. After you have created your image, save as "favicon.ico"
7. Now all you have to do is upload the favicon.ico image to your website root directory. The root directory is the main folder where all your files reside at, like your main index page. Some hosting companies will provide a directory called "html" or "public" or "web" "public_html". You MUST upload to your website root directory, otherwise, your browser will look for the favicon.ico image, will not find it and it will not display it on your browser.
put the following HTML code in between your <head> tags with the follwowing code:
<link rel="shortcut icon" href="favicon.ico" />
8. Now that you have uploaded to your root directory, you are done.
NOTE: There might other easy ways to do this, but this is the only way I know of. If you have a better suggestion, please help us by posting it here.
UPDATE: here are two options also:
<link rel="icon" href="http://www.wallpaperama.com/favicon.ico" type="image/ico" />
<link rel="shortcut icon" href="http://www.wallpaperama.com/favicon.ico" type="image/ico" />
If you have benefit from this small quick and easy to use step-by-step tutorial, we would appreciate if you link to wallpaperama.com Why link to us? The more sites that link to us, the more people like you will be able to find this free and helpful post.