Change favicon in a Wamp project

Asked

Viewed 805 times

0

I used the following code inside to change the favicon of my project 

<link rel="shortcut icon" href="img/favicon.ico"/>

It worked well on the index, but when entering the same code on the other pages the favicon remains the default for Wamp.

ps. the page directory is the same, so the link is directing to the same image, within the same folder (img).

Someone can see a light for my problem?

My code is like this:

inserir a descrição da imagem aqui

I don’t know why the inserted code that changes the favicon is only being reconnected on the index page. The following image was posted only to show that the browser does not recognize the code in question:

In the other pages he does not recognize the code line: inserir a descrição da imagem aqui

html front-end favicon
  • 1

    Guy Favicon usually stays at Cash, tries to clear the cash to see if it resolves

  • already cleaned. I deleted browser history by selecting all options

  • Since you are declaring the file as . ico try declaring his Type in the tag. Thus: <link rel="shortcut icon" TYPE="image/x-icon" href="img/favicon.ico" /> sometimes resolves...

  • Friend without the favicon link becomes difficult.... Because you don’t put the image of <head> already with the link of the right favicon?

  • It was posted for the conference.

  • there is something wrong in the second image not as it says with the first, the header has only 2 css already in your html has 3 css, 2 script, icon...

  • The second image is a print of CTRL+U in the browser. That’s why javascript doesn’t look normal. But the icon should appear. If it is not showing up, it is because the browser is not recognizing the code. And this is my problem

Show 2 more comments

1 answer

1

This is because the browser itself tries to search for the image favicon.ico in the root folder of your site or localhost. This usually occurs in Safari and Chrome (in other browsers I didn’t notice this behavior), so when does not define the:

<link rel="shortcut icon" href="...."/>

The browser alone will try to find the http://localhost/favicon.ico or http://site.com/favicon.ico

What you can do is put your favicon in the Wamp root folder and clear the browser cache, or you can simply create a include via PHP and add to all pages:

header.php:

<link rel="shortcut icon" href="...caminho do favicon..."/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

And on all pages add:

<head>
  <title>Meu titulo</title>
  <?php include 'header.php'; ?>
</head>

Relative vs absolute paths

The relative path is the one that loads relative to the path of the current page, so if it is on the page

 http://localhost/pagina.php

It will look for the favicon in:

 http://localhost/img/favicon.ico

if you’re on the page

 http://localhost/foo/bar/baz/pagina.php

It will look for the favicon in:

 http://localhost/foo/bar/baz/img/favicon.ico

That is to say it is the wrong way, so to avoid this add the complete (absolute) path of the favicon, for example:

header.php:

<link rel="shortcut icon" href="http://localhost/img/favicon.ico"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

However if you are going to send to a server, this will not work then you will have to change the address, in case you can use only the absolute path, without HTTP, putting a bar in front so /img/favicon.ico, this way it will search from root, example:

<link rel="shortcut icon" href="/img/favicon.ico"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

  • In fact the only thing that changed your suggestion in my code was to remove the line in each page and insert inside the header.php. Even so I made the changes, but it didn’t resolve. It’s still the same thing. And yes, I cleared the browser cache

  • @Amauri open in an anonymous tab and see if it still occurs. Probably the favicon path in your HTML is relative and not absolute

  • anonymity mode remains the same

  • @Amauri see the answer edition

  • I set the absolute path, and it’s still the same. The problem is not in the image reference, because all pages are in the same directory.

  • @Amauri open the browser console and see if there are any errors, check if all pages have actually been saved, check if PHP is using Xcache or Opcache (which has nothing to do with browser caching) ... Check the source code generated in the browser of the pages with problem by pressing Ctrl+U. For sure vc made some confusion.

  • As posted above, the browser is not recognizing the line of code that changes the favicon. The strange thing is that in the index it recognizes.

  • @Amauri looks at his image https://i.stack.Imgur.com/Uq7i9.png, inside the head has no LINK tag. Like I said, you must be making some mess at the time of saving.

  • No friend, this image is from F12 in the browser. In the code it was inserted, and it was saved. I don’t know why the browser is not recognizing. I’ll post the image of the complete code, and save it. -

  • @Amauri I know it’s from the browser, I work with it, I know the difference from a browser console to a friendly text editor. The problem is that if in the browser console does not appear the TAG LINK is because it is not there even, that’s why I said that you got confused in something, get confused is when you think you did something right, but you were wrong, you may be convinced that you did everything ok, but the result does not appear is because there is something wrong.

  • @Amauri This 192.168.1.220 is your computer or is another computer in your network?

  • I understood. I only disagreed when you said 'not there'. Look at the photo I posted of the code. It’s there, and you’re safe. The problem is that the browser is not 'pulling' this source code information.

  • The test is being done both in 192.168.1.220, and by another computer that is networked. The two present the same problem in Chrome

  • Not even there, look at the two images, by the two that you posted the Htmls are totally different, the problem has nothing to do with favicon, IE you must be saving on your computer, but the address 192.168.1.220 is another computer, I mean, you saved it just on your local machine, you know?

  • No friend, the source code is only in 192.168.1.220. All changes are being made on this computer (192.168.1.220). The source code is really different, Chrome is not recognizing the link to the favicon. this is the problem

  • Let’s go continue this discussion in chat.

  • @Amauri forgets favicon, look at the HTML codes of the two images, are different, this of course is not the same file, understand you must be saving home.php on your machine, but need to save on the 192.168.1.220 machine too, which I assume is a different machine

  • trying to open the chat here, just a minute

Show 13 more comments

Browser other questions tagged html front-end favicon

You are not signed in. Login or sign up in order to post.