Member Avatar for Karaten

How do you set one? I recently started HTML again and way back when I learned those didn't exist. What's the code for these?

  • 3 Contributors
  • 5 Replies
  • 117 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by Shanti C

Dani AI

Generated

Good start: pointed to the head link approach and noted format issues. If the icon still does not show up like described, the problem is almost always one of a few things — caching, wrong URL/path, server headers, or browser expectations. The checklist below helps isolate the cause and get a visible favicon quickly.

  • Confirm the icon file is actually reachable in the browser (open the direct URL like /favicon.ico or the exact path you used).
  • Use an absolute or root-relative path to avoid broken links from pages in subfolders (/favicon.ico is the simplest fallback).
  • Clear or bypass browser cache (private window or Ctrl+F5). Favicons are cached aggressively.
  • Check the network panel or run curl -I on the icon URL to verify a 200 response and a correct Content-Type (icon/png or image/x-icon). A 301/404 will stop display.
  • Modern browsers accept PNG/SVG; older Internet Explorer needed an .ico. Provide both or use a generator that creates proper multi-resolution files.
  • For touch devices and PWAs, add apple-touch-icon and a webmanifest so the site icon shows on home screens.

Example modern markup (use these in the document head):

<link rel="icon" href="/favicon-32x32.png" sizes="32x32" type="image/png">
<link rel="icon" href="/favicon-16x16.png" sizes="16x16" type="image/png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">

For a concise reference on current behavior and formats see MDN’s favicon overview (MDN: Favicon) and use a generator like RealFaviconGenerator to produce all required sizes and HTML.

Recommended Answers

All 5 Replies

Member Avatar for peter_budo

This is called favicon and it is add through link declaration of head section inside html document. To add one just do as follows

<html>
<head>
<title>Page Title</title>
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
</head>
//Rest of the page code

If you do not have suitable icon you can generate free one for example here at

Member Avatar for Karaten

Thanks.

Member Avatar for Shanti C

To add one just do as follows

<html>
<head>
<title>Page Title</title>
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
</head>
//Rest of the page code

end quote.

I have just tried that code ...but i can't seen that icon on my address bar...
Please help me...

Edited by mike_2000_17 because: Fixed formatting
Member Avatar for Karaten

Make sure the pic is a .ico file.

The site posted above converts images into .ico.

Member Avatar for Shanti C

ya i got my image from that site only...

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.