Modifier le favicon d'un site

From Joomla! Documentation

This page is a translated version of the page Changing the site favicon and the translation is 100% complete.

Other languages:
Deutsch • ‎English • ‎español • ‎français • ‎Nederlands • ‎русский • ‎中文(台灣)‎
Favicon-fr.png

Modifier le favicon de votre site web est une tâche relativement simple.

  1. Créer une image de 16x16 pixels. Vous pouvez utiliser un logiciel d'images tels que Photoshop, Gimp, Paint.net ou Windows Paint. Sinon, vous pouvez utiliser un outil en ligne tel que http://antifavicon.com/
  2. Convertissez au format ico en utilisant des sites gratuits tels que :
  3. Le fichier ainsi créé aura l'extension .ico. Copiez le fichier dans le répertoire /joomla/templates/<votretemplate> et nommez-le favicon.ico.
  4. Ouvrez un navigateur. Voyez-vous votre nouvelle icône ? Si oui, félicitations. Si ce n'est pas le cas, cela ne signifie pas nécessairement que vous ayez échoué. Les navigateurs sont conçus pour minimiser le trafic de données, par conséquent, ils n'actualisent pas le favicon à chaque affichage de page. Même l'actualisation de la page (F5) sera inutile. Il vous faudra donc actualiser la page de manière plus approfondie :
    • Mozilla / Firefox / Safari: cliquez simultanément sur la touche Maj et Actualiser, ou cliquez sur Ctrl-Maj-R (Cmd-Maj-R sur Mac) ;
    • IE: cliquez simultanément sur Ctrl et Actualiser, ou cliquez sur Ctrl-F5 ;
    • Konqueror: cliquez sur le bouton Actualiser, ou sur la touche F5 ;
    • Les utilisateur d' Opera peuvent avoir besoin de nettoyer complètement leur cache, dans Outils→Préférences.
    • Chrome: Maj-F5
    • Si cela ne fonctionne pas, vous devez supprimer les fichiers internet temporaires et l'historique, puis ouvrir à nouveau votre page. Vous pouvez également supprimer le favicon, rafraîchir votre navigateur par la touche F5 puis charger le favicon.

L'emplacement de mon favicon est différent

Certains templates contiennent du code qui redirige le navigateur vers un autre répertoire ou un autre fichier d'icône. Pour déterminer où devra se trouver votre nouveau favicon, examinez le fichier http://votresite.com/templates/votre_template/index.php et rechercher le code contenant le texte <link rel = "shortcut icon". Vous y trouverez l'indication du répertoire et du nom du fichier de l'icône. Copiez votre favicon à cet endroit, et donnez-lui le nom indiqué dans le lien (si vous le souhaitez, conservez une copie de l'ancien fichier). Assurez-vous que vous définissez correctement les droits d'accès permettant à votre serveur web d'accéder à ce fichier. Voir l'exemple ci-dessous.

<link rel="shortcut icon" href="http://votresite.com/templates/votre_template/icon/favicon.ico" />

Si vous ne souhaitez pas modifier le fichier favicon.ico dans le répertoire du template, le document html.php fait également référence au fichier favicon.ico. Le chemin est le suivant : "........\libraries\joomla\document\html\html.php". Ceci devrait vous éviter de basculer d'une icône à l'autre :

<link rel="shortcut icon" href="http://votresite.com/templates/votre_template/icon/votreicon.ico" />

dans le html du template et vous n'avez pas à supprimer le fichier favicon.ico. (pourquoi appeler l'icône deux fois ?)

Depuis le fichier html.php

// Try to find a favicon by checking the template and root folder
		$path = $directory . DS;
		$dirs = array( $path, JPATH_BASE . DS );
		foreach ($dirs as $dir )
		{
			$icon =   $dir . 'favicon.ico';
			if (file_exists( $icon ))
			{
				$path = str_replace( JPATH_BASE . DS, '', $dir );
				$path = str_replace( '\\', '/', $path );
				$this->addFavicon( JURI::base(true).'/'.$path . 'favicon.ico' );
				break;''