Joomla: Mettre en place une favicon

Appréciation moyenne:  / 41
Très mauvaisTrès bien 

Comment mettre une favicon lorsqu'on crée un template pour joomla 1.5?

Voici présenté comment mettre un favicon personnalisé avec joomla 1.5

prérequis:

connaitre l'arborescence minimum d'un template (Template Joomla Arborescence minimum)

connaitre le rôle des fichiers de base d'un template: index.php notamment (lien sur index.php expliqué)

savoir insérer le module "head" dans un fichier index.php (lien)

taille de la favicon: 16x16px

extension: .ico

(attention, il ne suffit pas de renommer un fchier.jpg, il faut créé un type de fichier ico (lien explication/méthode)

l'icone créée doit obligatoirement s'appeler:

favicon.ico

déposer cette icone dans le répertoire racine du template créé.

joomla détecte automatiquement cette image comme la favicon et rajoute alors une ligne dans le head de la page html construite à partir du index.php de la racine du template :

<link href="/templates/tranquille/favicon.ico" rel="shortcut icon" type="image/x-icon" />

et voilà.

Pour la voir dans Internet Explorer (parfois ça n'est pas instantané), mettre la page dans les favoris, apparemment ça l'aide  smiley
sinon, appuyez sur la touche CTRL+F5 pour recharger plus que la page en cours...

 

Mettre une favicon à la main

Si l'on souhaite mettre une favicon à la main (pour utiliser un fichier .png par exemple à la place d'un .ico, afin d'avoir une favicon transparente:

Tout d'abord il faut savoir que Internet Explorer (6 au moins, pour le 7 et 8 je ne sais pas encore) ne sait pas interpréter un favicon.png, il continuera donc à utiliser le favicon mis en place par défaut par joomla, il faut donc laisser le favicon.ico à la racine du template.

Déposez votre nouvelle favicon.png à la racine de votre template, à côté de la précédente.

Ensuite, pour donner une favicon différente pour opera et ff qui savent interpréter les fichiers.png en tant que favicon, rajouter cette ligne en plus:

<link rel="icon" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/favicon.png" type="image/png" />

ainsi, on peut avoir une belle favicon avec de la transparence, ce que ne sait pas faire IE.

l'instruction php:

<?php echo $this->baseurl ?>

permet à joomla de retrouver l'icone au bon endroit à tous les coups, elle donne le chemin au répertoire racine des templates.

et celle-ci:

<?php echo $this->template ?>

lui permet de récupérer le nom du template utilisé.
Ainsi joomla se construit l'url d'accès à la favicon tout seul.

 

Favicon pour l'interface d'administration

Enfin, une petite astuce pour mettre une favicon à l'interface d'administration (backend) à la place de celle de joomla:

mettez votre favicon.ico dans le dossier:

/administrator/template/khepri (si vous utilisez khepri comme template d'admin) à la place de la favicon joomla par défaut.