Welcome Guest ( Log In | Register)



2 Pages V   1 2 >  
Closed TopicStart new topic
> Little Icon Next To Address, How to get them?
krap
post Mar 17 2005, 05:30 PM
Post #1


Super Member
*********

Group: Members
Posts: 204
Joined: 6-October 04
From: London, uk
Member No.: 1,444



ive noticed lots of sites when i use opera have a little icon to the left of the address bar:
user posted image
user posted image
and i saw this frog when i was uploading the first 2 tongue.gif
user posted image
They look quite cool and since i dont know what they use (php or html etc)to get there im asking here if anyone knows how to get them?.(another reason is that most of the forums are hiding under a complicated sub-folder sort of thing) Thanks in advance
Go to the top of the page
 
+Quote Post
katif
post Mar 17 2005, 05:35 PM
Post #2


Advanced Member
*******

Group: Members
Posts: 140
Joined: 30-September 04
Member No.: 1,357



It's called favicon.. You need to have a program in which you can make files with .ico extension...
You need to make the icon, its size is 16x16
save it as favicon.ico and upload to your web directory.
then add <LINK REL="SHORTCUT ICON" HREF="favicon.ico"> in the head tag and the favicon should appear..
Go to the top of the page
 
+Quote Post
krap
post Mar 17 2005, 05:37 PM
Post #3


Super Member
*********

Group: Members
Posts: 204
Joined: 6-October 04
From: London, uk
Member No.: 1,444



thanks for the fast reply. smile.gif do you know what program to use to make the .ico files or even better an online one where you upload and convert?
thanks
Go to the top of the page
 
+Quote Post
RGPHNX
post Mar 17 2005, 06:06 PM
Post #4


Super Member
*********

Group: Members
Posts: 380
Joined: 22-December 04
From: usa
Member No.: 2,873



krap,
Ckeck out the tut over at trap17's sistersite. "Astahost.com". Theres a good tutorial there. I think "Homer" is the author( or one of the posters- can't remember which). NilsC turned me on to it Just search for "Favicon" when you get there.
Hope this helps
RGPHNX
Go to the top of the page
 
+Quote Post
Sprnknwn
post Mar 17 2005, 08:57 PM
Post #5


Privileged Member
*********

Group: Members
Posts: 821
Joined: 6-March 05
Member No.: 4,202



All you have to do is open photoshop, fireworks or another image editor, and make what you want to appear there in a small size (I Think itīs 16x16 or 32x32 pixels. Donīt know if both of them are correct, but I have one of 16x16 in my website and it works). You have to save that as a .bmp file and then rename it to .ico

Normally you pick your logo and resize it to smaller one, but you have to make sure that your logo will be crearly visible with that small size. If not, youīd better try with another thing that is representative of the site.

The favicon appears in Mozilla and Netscape-based browsers and Opera, but also in explorer when you bookmark a page. smile.gif
Go to the top of the page
 
+Quote Post
snlildude87
post Mar 17 2005, 08:57 PM
Post #6


Moderator
***************

Group: Members
Posts: 2,325
Joined: 8-March 05
From: Mawson, Antarctica
Member No.: 4,254



QUOTE(krap @ Mar 17 2005, 02:37 PM)
thanks for the fast reply.   smile.gif do you know what program to use to make the .ico files or even better an online one where you upload and convert?
thanks
*


The small image next to the address is called a favicon.

You don't have to download a program or anything to convert your images to a favicon. You can use an online tool by html-kit at http://html-kit.org. All you have to do is look for an image from your hard drive, and press Generate FavIcon.ico. Then, you can download the generate .ico file in a zip, and use it in your website!

Here's the website of the online tool that I was referring to ^: http://www.html-kit.com/e/favicon.cgi.

Also, to put the favicon in your browser, insert the following HTML code between the
CODE
<head>
tags:
CODE

<link rel="icon" href="swirl2.ico" type="image/x-icon">
<link rel="shortcut icon" href="swirl2.ico" type="image/x-icon">


katif mentioned
QUOTE
CODE
<LINK REL="SHORTCUT ICON" HREF="favicon.ico">
, but I added a third argument: the type. Also, putting two in your webpage will increase your chances of the favicon showing in older browsers.
Go to the top of the page
 
+Quote Post
krap
post Mar 24 2005, 05:11 PM
Post #7


Super Member
*********

Group: Members
Posts: 204
Joined: 6-October 04
From: London, uk
Member No.: 1,444



Thanks guys i did it smile.gif i think the reputation will go to Sprnknwn as he told me how to make it using paint.. which i found useful
smile.gif
If ya want to see my icon Click Here
Go to the top of the page
 
+Quote Post
dvldg
post Nov 21 2005, 02:09 AM
Post #8


Newbie
*

Group: Members
Posts: 1
Joined: 21-November 05
Member No.: 14,645



Here, this should help everyone: Favicon from Pictures L8R GUYS!!
Go to the top of the page
 
+Quote Post
cardude
post Nov 21 2005, 02:26 AM
Post #9


Member [Level 1]
****

Group: Members
Posts: 55
Joined: 20-November 05
Member No.: 14,638



QUOTE(dvldg @ Nov 20 2005, 09:09 PM)
Here, this should help everyone: Favicon from Pictures  L8R GUYS!!
*



That is a good site! I always go there when I want to make a favicon. They will automatically create the favicon for you, and then they give you the code to add to your website as well!