Skip to main content
Topic: Where is the favicon code?? (Read 8991 times) previous topic - next topic
0 Members and 1 Guest are viewing this topic.

Where is the favicon code??

Sorry if that has bene covered, ive been looking for references to it and cant find the code, stupidly!  :-[

I want to add this to give us a custom favicon and look smart when a shortcut is saved to the home screen on an iPhone etc.  i need to paste this into the global header. where is it??

Code: [Select]
<link rel="apple-touch-icon" sizes="57x57" href="/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192"  href="/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/manifest.json">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">

Re: Where is the favicon code??

Reply #1

Honestly, it's easier to replace the stock one in /themes/default/images. The file name is mobile.png. 

Re: Where is the favicon code??

Reply #2

Quote from: badmonkey – Honestly, it's easier to replace the stock one in /themes/default/images. The file name is mobile.png.

yes ive pointed this out, but been asked if this additional feature can be added. it means that someone can bookmark the site to their phone or tablet and it in doing so, get an icon that looks like an app. it needs to go in under the favicon code

Re: Where is the favicon code??

Reply #4

You can add this stuff to index.template.php that is present in themes/default/ or in the directory of your theme.
Bugs creator.
Features destroyer.
Template killer.

Re: Where is the favicon code??

Reply #5

I'm trying to insert such lines of code like in the start post in the index.template.php of my forum, but I always get error messages afterwards.
What is the reason for this?
At which position on the page do these lines have to be inserted and does something have to be changed in the code for it? I tried some changes but nothing of these worked.
ElkArte version: 1.1.8 / Theme: BeSocial / PHP 8.0


Re: Where is the favicon code??

Reply #6

I seem to have found the right or a right place.
In the index.template.php of the default theme I have included the long code here:

Code: [Select]
// Show all the relative links, such as help, search, contents, and the like.
echo '
<link rel="shortcut icon" sizes="196x196" href="' . $context['favicon'] . '" />
<link rel="help" href="', $scripturl, '?action=help" />
<link rel="contents" href="', $scripturl, '" />', ($context['allow_search'] ? '
<link rel="search" href="' . $scripturl . '?action=search" />' : '');

There I inserted the code between the third and the fourth line.
The new favicons and icons are now displayed everywhere where they should appear.
ElkArte version: 1.1.8 / Theme: BeSocial / PHP 8.0