Switchfire Switchfire - 8 months ago 46
HTML Question

Setting a single favicon for the entire website

Hello all at Stackoverflow,

Ok so I've been asked if I can add a favicon to a website, ok easy enough just this bit of code:

<link rel="shortcut icon" href="https://www.mysite.co.uk/images/favicon/favicon1.ico" />

This how ever requires it to be on each page. Does anyone know how to add a global favicon?

Yes I did do a hunt, but all sources told me to add it to each page!


Ok so I've found out Chrome, searchs for a favicon.ico file, generally if there is one in your file directory it will show it.

Firefox, I could only get working with a favicon.png file with this on each page:

<link rel="icon" type="image/png" href="/favicon.png" />

Apprently this way works with Opera aswell, i'll be testing it out soon

Answer Source

For future reference use php to include the header information (including the favicon) that stays consistent on each page so that you only have to edit one file instead of a large number of files.

Use <?include "header.php" ?> on all pages where your header.php includes all the code that is common to all pages

It could be something like:

<link rel="stylesheet" href="screen.css" type="text/css" media="screen" />
<script src="../quirksmode.js"></script>
<link rel="icon" href="/favicon.ico" type="image/x-icon" />

and all the other code that needs to be included on all the pages

See more about include here: http://php.net/manual/en/function.include.php

EDIT: For now you could open all files in an editor like notepad++ and do a find and replace to replace all occurrences of with \r\n where \r\n is the newline character for windows in the extended search mode. Notepad++ has the option to do a find and replace in all open files.