Simple Machines Community Forum

Customizing SMF => Tips and Tricks => Topic started by: ccbtimewiz on April 30, 2008, 03:01:10 PM

Title: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: ccbtimewiz on April 30, 2008, 03:01:10 PM
What is a favicon?



A favicon (short for favorites icon), also known as a website icon, or shortcut icon, is an icon associated with a particular website or webpage. A web designer can create such an icon and install it into a website (or webpage) by several means, and most graphical web browsers will then make use of it. Browsers that provide favicon support typically display a page's favicon in the browser's URL bar and next to the page's name in a list of bookmarks. Browsers that support a tabbed document interface typically show a page's favicon next to the page's title. The Microsoft Windows Shell uses favicons to represent "Internet shortcuts" to web pages. - Wikipedia

How do I go about implementing one on my website?

There are numerous ways of implementing a favicon into your website. The easiest way is to simply upload a windows ICO formatted icon that is 16 x 16 into the main directory of your site. This works about 80% of the time; because most modern day browsers look for this icon.

However because of older browser builds and IE, it's not so easy. Some require declarations from the template itself in order to show.

I've compiled a list of hacks that will add this icon to your browser-- it's up to you to decide which to use.


Method #1 - Adding the calls to your template.

Open index.template.php of your theme. To do this, you'll be needing to download your index.template.php from your server via an FTP connection.

How do I use FTP? / What is FTP? (http://docs.simplemachines.org/index.php?topic=480)

Once you do that, open it in a stable text editor such as notepad++ or wordpad, then do the following:

Find:
Code (index.template.php SMF 1.1.x and 2.x) Select
<title>', $context['page_title'], '</title>';

Replace with:
Code (index.template.php SMF 1.1.x and 2.x) Select
<title>', $context['page_title'], '</title>';

echo '<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />';
echo '<link rel="icon" href="/favicon.ico" type="image/x-icon" />';


After you finish this, follow the step at the very end of the guide and you should be all set.


Method #2 - Adding the calls to your template using conditional PHP statements.

This is a bit different from Method #1. This makes it so you can turn the favicon on or off by simply editing a variable in your template.

Open index.template.php of your theme. To do this, you'll be needing to download your index.template.php from your server via an FTP connection.

How do I use FTP? / What is FTP? (http://docs.simplemachines.org/index.php?topic=480)

Once you do that, open it in a stable text editor such as notepad++ or wordpad, then do the following:

Find:
Code (index.template.php SMF 1.1.x) Select
// The main sub template above the content.
function template_main_above()
{
global $context, $settings, $options, $scripturl, $txt, $modSettings;


Replace with:
Code (index.template.php SMF 1.1.x) Select
// The main sub template above the content.
function template_main_above()
{
global $context, $settings, $options, $scripturl, $txt, $modSettings;
$enable_favicon = true; // Use "true" to enable, "false" to disable.



Find:
Code (index.template.php SMF 1.1.x) Select
<title>', $context['page_title'], '</title>';

Replace with:
Code (index.template.php SMF 1.1.x) Select
<title>', $context['page_title'], '</title>';

// Don't alter this code. Alter the statement under the global declarations.
if ( $enable_favicon  )
         {
echo '<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />';
                echo '<link rel="icon" href="/favicon.ico" type="image/x-icon" />';
         }
// ----------------



Find:
Code (index.template.php SMF 2.x) Select
function template_html_above()
{
   global $context, $settings, $options, $scripturl, $txt, $modSettings;


Replace:
Code (index.template.php SMF 2.x) Select
function template_html_above()
{
   global $context, $settings, $options, $scripturl, $txt, $modSettings;
   $enable_favicon = true; // Use "true" to enable, "false" to disable.


Find:
Code (index.template.php SMF 2.x) Select
<title>', $context['page_title'], '</title>';

Replace with:
Code (index.template.php SMF 2.x) Select
<title>', $context['page_title'], '</title>';

// Don't alter this code. Alter the statement under the global declarations.
if ( $enable_favicon  )
         {
echo '<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />';
                echo '<link rel="icon" href="/favicon.ico" type="image/x-icon" />';
         }
// ----------------



Alternative Methods (Modification Installation using the Package Manager System)

A couple of people have made mods that edit this code for you-- however some of them might not work on all themes and require you to make edits. I've compiled this guide so anyone could do them on any theme. But if you're running the default theme and/or know a good amount of XML, then try out these mods:

#702 Favicon Mod (http://custom.simplemachines.org/mods/index.php?mod=702) by ccbtimewiz (http://www.simplemachines.org/community/index.php?action=profile;u=111571)
#1329 Add Favicon Support (http://custom.simplemachines.org/mods/index.php?mod=1329) by Deprecated (http://www.simplemachines.org/community/index.php?action=profile;u=166492)


How do I upload the favicon.ico image?

For the image, name it "favicon.ico" and save it in the Windows ICO format. Make sure this image is 16 x 16, and that it is located in:

%root%/public_html/

If that for some reason doesn't show you what you want, place the image in your root directory as well.

When you make this change, you'll be needing to clear your browser. Try clicking ctrl + f5, or restart your computer.
Title: Re: [HOW TO] Add a favicon (bookmark icon) to your site
Post by: karlbenson on April 30, 2008, 03:09:07 PM
Your line is invalid
echo '<link rel="shortcut icon" type="image/x-icon" href="favicon.ico"/>';

You need a space before />
like so
echo '<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />';

Alternatively btw, you can use my favicon mod.
Title: Re: [HOW TO] Add a favicon (bookmark icon) to your site
Post by: ccbtimewiz on April 30, 2008, 03:15:34 PM
Quote from: karlbenson on April 30, 2008, 03:09:07 PM
Your line is invalid
echo '<link rel="shortcut icon" type="image/x-icon" href="favicon.ico"/>';

You need a space before />
like so
echo '<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />';

Alternatively btw, you can use my favicon mod.

Ah, thanks for pointing that out. Fixed. :)

This is mainly for those whom use a custom theme that has a custom index.template.php file.
Title: Re: [HOW TO] Add a favicon (bookmark icon) to your site
Post by: darthvader61 on May 06, 2008, 07:03:57 AM
i can't apply this 1.1.5. it didn't work.

// The main sub template above the content.
function template_main_above()
{
global $context, $settings, $options, $scripturl, $txt, $modSettings;
$enable_favicon = 'Yes'; // Use "Yes" or "No".

// Show right to left and the character set for ease of translating.
echo '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"', $context['right_to_left'] ? ' dir="rtl"' : '', '><head>
<meta http-equiv="Content-Type" content="text/html; charset=', $context['character_set'], '" />
<meta name="description" content="', $context['page_title'], '" />', empty($context['robot_no_index']) ? '' : '
<meta name="robots" content="noindex" />', '
<meta name="keywords" content="PHP, MySQL, bulletin, board, free, open, source, smf, simple, machines, forum" />
<script language="JavaScript" type="text/javascript" src="', $settings['default_theme_url'], '/script.js?fin11"></script>
<script language="JavaScript" type="text/javascript"><!-- // --><![CDATA[
var smf_theme_url = "', $settings['theme_url'], '";
var smf_images_url = "', $settings['images_url'], '";
var smf_scripturl = "', $scripturl, '";
var smf_iso_case_folding = ', $context['server']['iso_case_folding'] ? 'true' : 'false', ';
var smf_charset = "', $context['character_set'], '";
// ]]></script>

<title>', $context['page_title'], '</title>';
// Don't alter this code. Alter the statement under the global declarations.
if ($enable_favicon == 'Yes') {
echo '<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />';
elseif ($enable_favicon == 'No')
echo ''; }
// ----------------
Title: Re: [HOW TO] Add a favicon (bookmark icon) to your site
Post by: ccbtimewiz on August 07, 2008, 10:03:48 PM
I've updated this post.
Title: Re: [HOW TO] Add a favicon (bookmark icon) to your site
Post by: [unplugged] on August 09, 2008, 10:00:13 PM
Am I missing something somewhere? In both FF2 and Opera 9.5, the favicon shows perfectly by simply adding the favicon.ico to the root of the site. I cannot find any reference to a "call" to the icon anywhere in my files.
Title: Re: [HOW TO] Add a favicon (bookmark icon) to your site
Post by: ccbtimewiz on August 09, 2008, 10:05:01 PM
Quote from: SunKing on August 09, 2008, 10:00:13 PM
Am I missing something somewhere? In both FF2 and Opera 9.5, the favicon shows perfectly by simply adding the favicon.ico to the root of the site. I cannot find any reference to a "call" to the icon anywhere in my files.

Most browsers are set up to look for that file. However other browsers are not. Other browsers require a reference in the template.
Title: Re: [HOW TO] Add a favicon (bookmark icon) to your site
Post by: [unplugged] on August 09, 2008, 10:14:27 PM
Other browsers being IE.  :P

....which could be accommodated by adding the two lines in the <head> as mentioned by Deprecated.

That darned IE..... ;D
Title: Re: [HOW TO] Add a favicon (bookmark icon) to your site
Post by: ccbtimewiz on August 09, 2008, 10:27:25 PM
Quote from: SunKing on August 09, 2008, 10:14:27 PM
Other browsers being IE.  :P

....which could be accommodated by adding the two lines in the <head> as mentioned by Deprecated.

That darned IE..... ;D

More like the other hundreds of browsers.
Title: Re: [HOW TO] Add a favicon (bookmark icon) to your site
Post by: Deprecated on August 10, 2008, 05:09:39 AM
Quote from: SunKing on August 09, 2008, 10:14:27 PM
Other browsers being IE.  :P

....which could be accommodated by adding the two lines in the <head> as mentioned by Deprecated.

That darned IE..... ;D

Actually I've got a mod package written up and ready to submit, "Add Favicon.ico Support" which will be available at SMF's mod site early next week. The code is easy to add in manually, but the mod package will allow even newbies to put it in their SMF.

It's true that most browsers automatically pick up your favicon, but it is correct form to be fully compliant by adding the appropriate tag to your headers. Obviously this is of little importance to some people. I myself kind of like the icons, because they give your site a more professional look.
Title: Re: [HOW TO] Add a favicon (bookmark icon) to your site
Post by: Deprecated on August 10, 2008, 11:29:25 AM
Just FYI, I've submitted my mod package Add Favicon.ico Support (http://custom.simplemachines.org/mods/index.php?mod=1329) to the modsite, and it will be available when/if the team approves it. The readme.txt file has additional information, mainly links to informational sites and to an online favicon generator to get people up an running as quickly as possible. Experts have no problem adding this stuff and now with my mod even newbies can add the header tags as quick as a click! :)
Title: Re: [HOW TO] Add a favicon (bookmark icon) to your site
Post by: ccbtimewiz on August 10, 2008, 11:32:08 AM
Quote from: Deprecated on August 10, 2008, 11:29:25 AM
Just FYI, I've submitted my mod package Add Favicon.ico Support (http://custom.simplemachines.org/mods/index.php?mod=1329) to the modsite, and it will be available when/if the team approves it. The readme.txt file has additional information, mainly links to informational sites and to an online favicon generator to get people up an running as quickly as possible. Experts have no problem adding this stuff and now with my mod even newbies can add the header tags as quick as a click! :)

Erm, I do apologize, but this mod already exists....

http://custom.simplemachines.org/mods/index.php?mod=702

And I'm taking development on it from karlbenson.
Title: Re: [HOW TO] Add a favicon (bookmark icon) to your site
Post by: LOADING... on August 25, 2008, 10:56:56 AM
Thank you i would also like to add this one on my forum too! ;D
Title: Re: [HOW TO] Add a favicon (bookmark icon) to your site
Post by: Deprecated on August 25, 2008, 11:35:29 AM
If you are running SMF 1.1.2, 1.1.3 or 1.1.4 you can use either modification. I presume ccbtimewiz will update his mod at some point to be compatible with current SMF releases.

If you are running SMF 1.1.5 or 2.0b3.1 you can install my modification. As far as I know it is compatible with all SMF versions even including the earlier ones. I have not tested it with versions prior to 1.1.5 because they are obsolete.

Here: Add Favicon Support (http://custom.simplemachines.org/mods/index.php?mod=1329)
Title: Re: [HOW TO] Add a favicon (bookmark icon) to your site
Post by: ccbtimewiz on August 28, 2008, 01:54:53 PM
Updated my main post. :)
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Deprecated on August 28, 2008, 02:04:21 PM
That post looks suspiciously familiar! ;)



"If we have seen farther, it is because we are standing on the shoulders of giants." :)
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Smoky "Rider" Blue on September 05, 2008, 12:23:05 AM
you know, i have never run into a issue with a flavicon not showing up in any of the browsers i have used, and i had 10 at one time on my pc, just by adding it to the root of the site where the site begins. ;)

but good mod.. ;)
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: ccbtimewiz on October 09, 2008, 11:50:18 AM
Updated.
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: LOADING... on October 16, 2008, 05:18:16 AM
It took me long time to add this mod! but finally it worked
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: ccbtimewiz on October 16, 2008, 11:58:24 AM
Glad to see you got it. :)
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: simmer on November 23, 2008, 08:57:54 PM
thanxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx bro thanx alot :D :D :D nd this is the first time i have added mod manually  :) thanx fr gr8 explation muah thanx bro respect fr ya :)



edit: we don't need a whole page of worship :)
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Deprecated on November 23, 2008, 09:01:58 PM
(1) somebody needs to write a textish-English dictionary

(2) somebody needs to write a smiley maximum limit mod

(3) somebody needs to step back from the drugs! :P
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Smoky "Rider" Blue on November 24, 2008, 02:29:03 AM
lmao!!! good one Depreciated!!!  :P

now let me go rest my eyes..  :o ;)
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: simmer on November 24, 2008, 11:55:58 AM
Quote from: Deprecated on November 23, 2008, 09:01:58 PM
(1) somebody needs to write a textish-English dictionary

(2) somebody needs to write a smiley maximum limit mod

(3) somebody needs to step back from the drugs! :P

lemme correct u nt smiley images per post :P
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Deprecated on November 24, 2008, 12:54:48 PM
Well I'm glad you are taking the teasing with good humor Simmer. :) You're a good sport! :D


Actually I thought your mega-smilies post was pretty funny! :P :P :P
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: vulcan59 on November 27, 2008, 12:31:28 AM
Quote from: Deprecated on November 23, 2008, 09:01:58 PM

(2) somebody needs to write a smiley maximum limit mod


Apologies for butting in but yes it's been done incase you are not aware

http://www.simplemachines.org/community/index.php?topic=17213.0
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: dvancamp on January 25, 2009, 06:44:58 PM
Great mod!  I was able to get it working (mostly) without asking for help.

The favicon.ico works just fine on the main forum page and most other pages, HOWEVER, it is not working when I view/edit a post, or when I am viewing the topics in a particular board.  Is there another .php file we need to add:

echo '<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />';
echo '<link rel="icon" href="/favicon.ico" type="image/x-icon" />';

??

Thank you in advance!
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: JimM on February 06, 2009, 12:15:04 AM
@dvancamp - The icon should be showing on all pages without having to insert it in any other files.  Try ctrl + F5 and see if that clears things up.
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: garylue on April 23, 2009, 07:23:52 PM
Hi- I installed the mod and have the favicon.ico in the root of the site, and of the forum but no show in Firefox or IE. Refreshed cache with no luck.  Running SMF 1.1.8. 

Thanks for the help.

http://kluedesigns.com/talk
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: garylue on April 23, 2009, 07:43:09 PM
Nevermind.  I uninstalled and reinstalled and it works!  thanks!
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: aikencolon on May 04, 2009, 08:43:36 PM
man, the only thing worse than not getting this mod to work is seeing other people make it work.
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: AlExAlExAlEx on July 22, 2009, 09:46:46 PM
I installed the mod , i followed this tutorial , i uploaded 16x16 .ico to my root/html , deleted all firefox private data , restarted firefox and it's still showing the deafult favicon.

PS : I'm using the deafult theme.
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: WillyP on August 02, 2009, 10:11:06 PM
Sometimes it takes a little while to show up, sometimes more than a little...   ;)

BTW, here's a website to create a favicon: http://www.favicon.cc/?
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: TheListener on August 02, 2009, 10:40:22 PM
The only thing I am unsure of is where to put it ie root directory. What is the root directory?
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: JBlaze on August 02, 2009, 10:44:16 PM
Quote from: TheListener on August 02, 2009, 10:40:22 PM
The only thing I am unsure of is where to put it ie root directory. What is the root directory?

The directory where SSI.php, ssi_example.php, etc are :)
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: TheListener on August 02, 2009, 10:54:23 PM
Ok smarty pants  ;D

The favicon is in the root directory and er nothings changed.

Any suggestions?

Keeping it clean of course.
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: JBlaze on August 02, 2009, 10:55:42 PM
Hard refresh.

CTRL + F5
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: TheListener on August 02, 2009, 10:57:28 PM
Done that 5 times now  :D
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: JBlaze on August 02, 2009, 11:08:04 PM
Quote from: TheListener on August 02, 2009, 10:57:28 PM
Done that 5 times now  :D

Sometimes, browsers take a while to re-update favicons. Especially IE
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: TheListener on August 02, 2009, 11:11:12 PM
Is it the same with Firefox?
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: JBlaze on August 02, 2009, 11:11:50 PM
Quote from: TheListener on August 02, 2009, 11:11:12 PM
Is it the same with Firefox?

Not normally but sometimes.
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: TheListener on August 02, 2009, 11:14:27 PM
Thanks bud.

Will give it a couple days then throw a stinkbomb at ya if nothing has happened.
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: JBlaze on August 02, 2009, 11:16:22 PM
/me takes said stinkbomb and loads it with enough flatulence to kill king kong
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: fff on August 15, 2009, 08:07:37 AM
where can i find this %root%/public_html/
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: TheListener on August 15, 2009, 08:10:18 AM
The root is the main directory where you first get taken to via ftp or your server control panel.
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: WillyP on August 22, 2009, 09:21:53 PM
Firefox: go to "Tools", "Clear Recent History", check "Cache" and click "Clear Now". Then close FireFox, reopen and it should update your favicon. To update your bookmark icon, delete the bookmark, and re-bookmark it.
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Kat9119 on September 03, 2009, 06:24:17 PM
This worked great with the current version of Firefox! Thanks!
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: ScottDB on September 11, 2009, 12:07:41 PM
Does this mod support animated favicons?
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: TheListener on September 11, 2009, 11:22:48 PM
http://custom.simplemachines.org/mods/index.php?mod=702

ScottDB the link will take you to the actual mods topic.
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: thesikaleon on September 19, 2009, 03:01:31 PM
Quote from: ccbtimewiz on April 30, 2008, 03:01:10 PM

Find:
Code (index.template.php SMF 1.1.x and 2.x) Select
<title>', $context['page_title'], '</title>';

Replace with:
Code (index.template.php SMF 1.1.x and 2.x) Select
<title>', $context['page_title'], '</title>';

echo '<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />';
echo '<link rel="icon" href="/favicon.ico" type="image/x-icon" />';



How do I upload the favicon.ico image?

For the image, name it "favicon.ico" and save it in the Windows ICO format. Make sure this image is 16 x 16, and that it is located in:

%root%/public_html/



That works perfect!

But how can I use an animated gif ?
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: WillyP on September 19, 2009, 09:29:19 PM
How annoying. But if you must, try this site, http://www.favicon.cc/? (http://www.favicon.cc/?), I am not sure if you can directly upload an animated gif, but you can make animated icons. Or here's another: http://www.html-kit.com/favicon/ (http://www.html-kit.com/favicon/)
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: lazywealth on September 27, 2009, 03:55:26 PM
I added the codes to my ad mod just the way we add the adsense codes but did not permit it to show anywhere in the boards  Then i uploaded the icons to my webroot. And the icon is showing.....  Here (http://www.forumwalls.com)

Here (http://www.forumwalls.com)

Here (http://www.forumwalls.com)
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Arantor on September 27, 2009, 10:25:07 PM
lazywealth: for more on the Ad Mod please ask in the Ad Mod's topic or at smfads.com (their support site), this is not relevant to this tip/trick.
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Libelcom on October 19, 2009, 08:44:05 AM
QuoteQuote from: ccbtimewiz on April 30, 2008, 03:01:10 PM

Find:

Code: (index.template.php SMF 1.1.x and 2.x) [Select]
<title>', $context['page_title'], '</title>';
Replace with:

Code: (index.template.php SMF 1.1.x and 2.x) [Select]
<title>', $context['page_title'], '</title>';
echo '<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />';
echo '<link rel="icon" href="/favicon.ico" type="image/x-icon" />';

How do I upload the favicon.ico image?

For the image, name it "favicon.ico" and save it in the Windows ICO format. Make sure this image is 16 x 16, and that it is located in:

%root%/public_html/


That works perfect!

I've installed the mod about 1 hour ago and so far I haven't seen any favicon on my forum :(, how long should I wait until it's going to work  ???
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Arantor on October 19, 2009, 11:00:33 AM
Did you add favicon.ico to the right directory? If so please can we have a link to your forum?
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Libelcom on October 19, 2009, 01:51:33 PM
For my part I did add the favicon.ico to the right directory :D But, please help and my URL:  http://www.libelcom.com/community/

Thank you!
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Arantor on October 19, 2009, 01:59:05 PM
I didn't see a file for favicon.ico either in www.libelcom.com/favicon.ico (where it really needs to be) or www.libelcom.com/community/favicon.ico (where it wouldn't work anyway)
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Libelcom on October 19, 2009, 02:15:57 PM
Really? in that case, please guide me through it and explain to me how to add it correctly (step by step pls :)) Thanks...
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Arantor on October 19, 2009, 03:06:09 PM
Where did you put the file? And where is your forum?
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Libelcom on October 19, 2009, 04:33:54 PM
My forum is http://www.libelcom.com/community/ so, I added the favicon here: /public_html/libelcom/community/favicon.ico

Or should I have added it somewhere else?
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Arantor on October 19, 2009, 09:08:49 PM
It appears that favicon.ico there is actually a folder as evidenced by hxxp://www.libelcom.com/community/favicon.ico/ and indeed the icon appears to be hxxp://www.libelcom.com/community/favicon.ico/34-favicon.ico

You need to move that to become hxxp://www.libelcom.com/favicon.ico
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Libelcom on October 20, 2009, 08:00:21 AM
Well, http://www.libelcom.com/ is my main website, but I moved the favicon.ico to that URL anyway. But after moving it, restarting my pc (twice!) and have been waiting for almost 4 hours now, there is still no favicon on my forum :'(

Other idea's?
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Arantor on October 20, 2009, 08:23:41 AM
That's because it wasn't done correctly.

The actual image is currently visible at hxxp://www.libelcom.com/favicon.ico/34-favicon.ico

You need to move that 34-favicon.ico file up a level, delete the favicon.ico folder, then rename 34-favicon.ico to favicon.ico.
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Libelcom on October 20, 2009, 02:58:54 PM
Yes, I did it!! Finally! It looks very cute ;D

Thanks for your help, Arantor The GREAT! :)
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Eternalism on November 10, 2009, 01:25:57 AM
I think you could make this more simple for the noobs cause I had alot of trouble figuring out this tut. Here is how I added my favicon.

1. Download the mod. http://custom.simplemachines.org/mods/index.php?mod=702

2. Follow Method #1 - Adding the calls to your template.

3. Make your favicon and upload it to a image hosting site.

4. Configuration>Themes and Layout>Themes and Settings>Pick your Theme>Theme Options and Preferences> Favicon Image URL: Add your image address from hosting site. Done!
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: RiDFiCK on April 08, 2010, 01:27:15 PM
Hello,

I´ve trouble in installing the MOD.

I use RC3 and Theme "Actualism"

When I try to instal it appears erros so I don´t will instal after know it´s save..hehe

Can anyone help?
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: RiDFiCK on April 08, 2010, 08:12:23 PM
Problem already solved. Thanks anyway
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: flapjack on April 08, 2010, 08:36:38 PM
Quote from: RiDFiCK on April 08, 2010, 08:12:23 PM
Problem already solved. Thanks anyway
can you share ho you fixed it for everyone that will find this topic in future?
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: RiDFiCK on April 09, 2010, 09:49:38 AM
As I say on the first post i´ve made. Before installing it says that it have found errors. So normaly we shouldn´t install.

But I´ve decided to get the risk and installed anyway. And it work. No problem.

RC3+Actuaism Theme, work don´t worry about it. :D

Cumps
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: irwin on June 22, 2010, 02:48:24 PM
sorry but i have the same problem. already maked change inside index.template... but i can;t find whre write my configuration setting under 2rc3... readden the post before... but without find the form tu put the favicon url..
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: printing.host on July 23, 2010, 02:28:05 PM
Simple way to  Add a favicon:

Most browsers search by default for favicon.ico in the root folder of the website / blog the access. So it's enough to place your favicon.ico  in the root folder without adding additional code and the favicon will be displayed. However the code below should be used, especially if the favicon is not located in the root folder.

Enjoy!  ;D
PrintingHost.com
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: petelta on July 30, 2010, 04:47:50 PM
This is great.  Good how to advice.  Just what I was looking for. 

P.S. That picture of the pole vaulter (im assuming), is smoking  O:)
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Grim Line on August 03, 2010, 05:44:06 PM
Worked great. The .ico part didn't work so i just changed the link to .png aswell as the picture then it worked fine. Thanks.
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Boba_Fett on May 15, 2011, 05:57:28 AM
The normal <link rel="shortcut icon" href="Themes/default/images/favicon.ico"> works fine on the main page but not on any others, i've installed and tried anything to get the icon on all pages but it just wont work, anyone know how to fix this ?

http://sg-carterpack.com/index.php
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: sieemma on April 26, 2018, 07:48:54 AM
Hello, is there a current mod to add favicon? I get the statement that the one stated here is outmoded.
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Shambles on April 26, 2018, 09:07:39 AM
Quote from: sieemma
Hello, is there a current mod to add favicon?

What version of SMF? The mod should still work for you if you are on the 2.0.* branch. If there are error shown during the installation, the mod's page explains how to add the small bits of code manually.


QuoteI get the statement that the one stated here is outmoded.

Try simply uploading your favicon.ico file to your forum's root folder. Most modern browsers will soon pick it up and start using it.
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: GigaWatt on April 26, 2018, 07:03:55 PM
Except for older versions of IE... which is why I'm planning on implementing this manually as soon as I have the time.
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Jailer on June 13, 2018, 05:52:59 PM
Quote from: GigaWatt on April 26, 2018, 07:03:55 PM
Except for older versions of IE...

Which NO ONE should be using..........just sayin.......
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: gusu on September 30, 2018, 01:51:43 PM
I think there is also a plugin on Wordpress for Favicon. Can we use it too?
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: Arantor on September 30, 2018, 01:55:50 PM
You can't use WordPress plugins on SMF - but you don't need to, just uploading a file in the right place is enough.
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: WolfJ on July 26, 2021, 09:55:22 AM
Thanks very much for this guide really appreciate it. I spent years emulating the favicon mod to work on newer SMF versions but it's now stopped working so this guide was great to find.
Title: Re: [HOW TO] Add a favicon (bookmark/favorite icon) to your forum
Post by: ehpoulsen on September 06, 2021, 03:02:22 PM
Great guide, after some time I got it to work as well :)