Ajouter la Font Awesome à Joomla

26 novembre 2014 Mis à jour : 26 mars 2022

Tutoriel Joomla

Ajouter la Font Awesome à son template Joomla

Apparues il y a quelques années, les icônes comme Font Awesome connaissent un succès grandissant et mérité. Si certains templates les proposent maintenant nativement, ce n'est pas encore le cas de tous les templates en circulation. Au travers de ce tutoriel, nous allons voir comment ajouter la Font Awesone à votre template..

Table des matières
- Installation
- Utilisation

Comme son nom l'indique, la Font Awesome est bien une police, c'est à dire que vous pouvez facilement changer la couleur et la taille avec un peu de code CSS. Cependant le point le plus important à retenir est que ces icônes sont des fichiers vectoriels qui conservent leur aspect quelque soit l'appareil sur lequel ils sont affichés (même sur les écrans de type Retina).

Installation

Plusieurs solutions sont disponibles pour intégrer la Font Awesome dans un template. Nous allons en voir 2 qui me semblent être parmi les plus simples à mettre en oeuvre.

Le code

Vous allez voir, il suffit juste d'ajouter une simple ligne de code dans votre template. Ouvrez le panneau d'administration puis sélectionnez "Extensions - Gestion des templates".

Sur la gauche, cliquez d'abord sur "Template" (par défaut, vous arrivez sur l'onglet "Style") puis sur "Détail et fichiers" pour votre template.

Cliquez sur le ficher "index.php" dans la liste proposée à gauche de l'écran.

Avant la balise < /head > , ajoutez le code suivant :

<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">

Pensez à cliquer sur "Enregistrer et fermer".

Une extension tierce

Il existe des extensions qui permettent d'intégrer la Font Awesome directement dans votre site Joomla. Parmi celles-ci, je recommande le plugin NS Font Awesome qui est gratuite.

Ouvrez "Extensions - Gestion des extensions". Dans la barre de recherche, indiquez "NS Font Awesome" puis cliquez sur l'icône en forme de loupe.

L'extension apparait, il vous suffit de cliquer dessus pour accéder à la prochaine étape. Cliquez ensuite sur "Installer" pour lancer le processus d'installation du plugin directement sur votre site.