SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Addict ornette's Avatar
    Join Date
    Mar 2005
    Location
    Tenerife, Canary Isles
    Posts
    175
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    How to put an image into the URL bar of a browser

    Hello there.

    How do you put that little image into the address bar of the browser, with the URL? Like the Sitepoint logo in front of the page address.
    Thanks, it's intriguing.

  2. #2
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    In the head element:

    Code HTML4Strict:
    <link rel="shortcut icon" type="image/x-icon" href="/favicon.ico">
    Birnam wood is come to Dunsinane

  3. #3
    SitePoint Addict ornette's Avatar
    Join Date
    Mar 2005
    Location
    Tenerife, Canary Isles
    Posts
    175
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Great, thanks. Does that include XHTML too?

    I've just put it into the Head, but I don't understand how to put one of my images in. Where do I put my image? Please

  4. #4
    SitePoint Wizard bronze trophy Tailslide's Avatar
    Join Date
    Feb 2006
    Location
    Bedford, UK
    Posts
    1,687
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Go here http://www.chami.com/html-kit/services/favicon/ and get a favicon then put it in your document head (add a "/" before the closing ">" for xhtml)
    Little Blue Plane Web Design
    Blood, Sweat & Rust - A Land Rover restoration project

  5. #5
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ornette View Post
    Great, thanks. Does that include XHTML too?
    Yes, except that you need to close the tag with '/>' instead of just '>'.

    Quote Originally Posted by ornette View Post
    I've just put it into the Head, but I don't understand how to put one of my images in. Where do I put my image? Please
    You can put it anywhere, as long as the href attribute in the <link> tag points to it. In my example the address is '/favicon.ico', which means a file named favicon.ico (the traditional name for this) in the root directory of the web site.

    It should be an ICO file, though. You may need some extra software to create one of those, as Tailslide indicated.
    Last edited by AutisticCuckoo; Apr 3, 2008 at 05:54.
    Birnam wood is come to Dunsinane

  6. #6
    SitePoint Addict ornette's Avatar
    Join Date
    Mar 2005
    Location
    Tenerife, Canary Isles
    Posts
    175
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Fantastic, both thanks very much.
    Ornette

  7. #7
    SitePoint Addict tauperkin's Avatar
    Join Date
    Jun 2006
    Posts
    210
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That site that Tailslide gave the link for is great. It's what I use to make mine. Really easy -- you just upload the image you want to use and it creates it.

  8. #8
    SitePoint Member
    Join Date
    Apr 2008
    Posts
    7
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    indeed. The image you're talking about is also called 'favicon'. might be interested for you to know
    provide readers with real insight into the world of
    online business: netbusinessblog.com

  9. #9
    SitePoint Enthusiast cssiscool's Avatar
    Join Date
    Feb 2006
    Location
    East Moline, Illinois
    Posts
    87
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    you use a favicon.ico image for that. search the web for instructions on how to make the. there are several sites that have online tools that will turn a 16x16 or 32x32 icon into and .ico image for you.

    some people will tell you to put the following into you head tag. but it's not necessary unless you are linking to a .ico on another web site or using a different image format.

    Code:
    in html
    
    <link rel="shortcut icon" type="image/x-icon" href="/favicon.ico">
    
    in xhtml
    
    <link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" />
    just upload the image to your root directory and the browser will automatically load the .ico without the link tag.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •