Tutoriel Installer Font Awesome en version 5.7.2 et l'utiliser sur votre forum XenForo [2.0]

[SyTry]

Salut à toi membre de SyTry Community !

Aujourd'hui je vous partage un tutoriel pour utiliser la version 5.7.2 de Font Awesome sur votre forum en XenForo 2.0 !

Dans votre template PAGE_CONTAINER cherchez ceci (CTRL + F) :

S'il vous plaît, Connexion ou S'inscrire pour voir le code !

C'est celui du début de votre template. Ensuite ajoutez ceci en dessous :

Pour afficher le contenu, vous devez vous Identifier ou vous Inscrire.

Ensuite rendez vous ici pour connaitre le code des icônes :

S'il vous plaît, Connexion ou S'inscrire pour voir le lien !

Pour l'exemple voici le code d'un widget :​

S'il vous plaît, Connexion ou S'inscrire pour voir le code !

Résultat :

Pour utiliser les Font Awesome en version 5.6.3 via du CSS, voici des exemples pour mon grade :​

S'il vous plaît, Connexion ou S'inscrire pour voir le code !

Résultat :

Egalement avec mon grade :​

S'il vous plaît, Connexion ou S'inscrire pour voir le code !

Résultat :

Désormais le font-family est différent, voici les icônes en fonctions de la version des Font Awesome :​

• Brands :
  S'il vous plaît, Connexion ou S'inscrire pour voir le lien !
• Solid :
  S'il vous plaît, Connexion ou S'inscrire pour voir le lien !
• Regular :
  S'il vous plaît, Connexion ou S'inscrire pour voir le lien !
• Light :
  S'il vous plaît, Connexion ou S'inscrire pour voir le lien !

Brands et Solid sont des versions gratuites, et Regular ainsi que Light des versions payantes (pro) !

Voici le code du font-family en fonction de la version :​

• Brands : font-family: "Font Awesome 5 Brands";
• Solid : font-family: "Font Awesome 5 Free";
• Regular : font-family: "Font Awesome 5 Pro";
• Light : font-family: "Font Awesome 5 Pro ";

Vous pouvez également retrouver l'utilisation des Font Awesome ici :

Pour afficher le contenu, vous devez vous Identifier ou vous Inscrire.

J'autorise le partage de ce tutoriel avec les crédits : SyTry !​

SyTry,​

 

[Lucifer]

merci l’ami, mais j’ai un problème, les FA ne fonctionnent pas chez moi

 

[laurent68]

Merci pour le partage
Je pense qu'il faut installer la version 5.20 dans son ftp ?

 

[SyTry]

Merci pour le partage
Je pense qu'il faut installer la version 5.20 dans son ftp ?

Non y a rien a installer sur le FTP, seulement un lien pour l'intégration

 

[laurent68]

Non y a rien a installer sur le FTP, seulement un lien pour l'intégration

Fonctionne aussi pour les CSS ?

 

[BlackBetting]

Merci pour la partage c'est cool

 

[laurent68]

Pour les codes CSS suffit de changer :

font-family: "FontAwesome";
Par :
font-family: "Font Awesome 5 Brands";

 

[Lucifer]

Pour les codes CSS suffit de changer :

font-family: "FontAwesome";
Par :
font-family: "Font Awesome 5 Brands";

Ou ça ??

 

[laurent68]

Ou ça ??

Les codes css que tu mets dans extra.less
exemple avant tu mettais des codes qui ressemble a sa :

S'il vous plaît, Connexion ou S'inscrire pour voir le code !

Pour la version 5.20 tu change le code font-family: "FontAwesome"; par font-family: "Font Awesome 5 Brands";

 

[Tutifruti]

Merci, j'avais eu des problème avec les FA

 

[SyTry]

Bonsoir,

Mise à jour du lien pour la version 5.3.1.
Modification du tutoriel : explications des 4 types d'icônes (brands, solid, regular, light) Font Awesome ainsi que un tutoriel sur l'utilisation du CSS.

SyTry,

 

[fifi78440]

merci man au top

 

[luchugsat]

Bonjour, une fois de plus un grand merci pour le travail fournis et partagé.

 

[DeaD]

merci, c'est gentil

 

[OTuGaMoDz]

merci bien pour le partage

 

[lordc]

Merci pour le tuto ça va m'aider

 

[Spartan9802]

Encore merci a toi pour cette astuce

 

[AbsoluVape]

J'adore merci pour ce partage

 

[BuugsBunny]

Yeehhh merci :-D

 

[SyTry]

Salut, mise à jour du lien Font Awesome en version 5.6.3 !

SyTry,