Nous mettons à jour nos icônes vers Font Awesome 6 !

Qu’est-ce que Font Awesome ?

Discourse utilise un ensemble gratuit d’icônes de Font Awesome dans toute son interface. Vous les voyez sur les barres d’outils, les badges, les boutons, etc… voici notre barre d’outils de composition :

image

Depuis 2018, nous utilisons Font Awesome 5 (annonce originale), et entre-temps, Font Awesome 6 a été publié. La version 6 comprend de nouvelles icônes, quelques mises à jour générales de style et des renommages.

À partir d’aujourd’hui, Discourse commencera également à utiliser la version 6 ! Plus précisément, la version 6.6.0. Ce n’est pas un changement visuel énorme, mais vous remarquerez quelques différences :

image

Que comporte cette mise à niveau ?

Cette mise à niveau implique un certain nombre de renommages pour rendre les choses plus cohérentes.

Pour accompagner les communautés Discourse dans la mise à niveau, les changements seront déployés en plusieurs phases :


:white_check_mark: Aujourd’hui - Font Awesome mis à niveau vers la v6, les icônes seront automatiquement remappées

:white_check_mark: Bientôt - les messages de dépréciation seront activés pour aider les auteurs de thèmes/plugins à mettre à jour leurs noms d’icônes

:white_check_mark: T1 2025 - bannière d’avertissement administrateur activée pour toutes les dépréciations restantes

:white_check_mark: 1er avril 2025 - suppression du remappage automatique et de la bannière d’avertissement administrateur

:white_check_mark: 2 mai 2025 - suppression du mappage des anciens noms d’icônes et journalisation au niveau d’erreur


Je vois une icône manquante, comment puis-je résoudre ce problème ?

  1. Ouvrez les outils de développement du navigateur et trouvez l’élément pertinent avec l’icône manquante.

  2. Notez le nom actuel de l’icône affectée et recherchez le bon nom d’icône pour le mettre à jour. Le mappage des noms d’icônes peut être consulté sur discourse/lib/deprecated_icon_handler.rb at fbc2cfb6185c00950da8e915b1a32546e7020913 · discourse/discourse · GitHub.

  3. Mettez à jour le thème/plugin pertinent auquel l’élément appartient, ou informez son développeur pour qu’il effectue la mise à jour.

Si vous avez besoin d’aide pour cela, n’hésitez pas à créer un sujet de Support, ou à contacter votre fournisseur d’hébergement comme d’habitude.

Que doivent savoir les auteurs de thèmes et de plugins ?

Les méthodes couvertes dans Introducing Font Awesome 5 and SVG icons fonctionneront toujours pour ajouter de nouvelles icônes et des icônes personnalisées.

Nous avons depuis supprimé le remappage des anciens noms, et si votre thème/plugin utilise toujours d’anciens noms, vous verrez des espaces vides là où se trouvaient certaines de vos icônes.

Il y a beaucoup de nouvelles icônes !

La mise à niveau de la version 5 à la version 6 introduit des centaines de nouvelles icônes gratuites, près de 500 au total !

Vous pouvez parcourir l’ensemble complet ici, trié pour montrer les nouvelles additions en premier — et la recherche est très pratique : Search Icons & Find the Perfect Design | Font Awesome

39 « J'aime »

Est-ce encore nécessaire :

@import url("https://use.fontawesome.com/releases/v5.13.0/css/all.css");

Et faut-il modifier ceci :

<script type="text/discourse-plugin" version="0.8">
    api.replaceIcon('d-post-share', 'share-alt');
    api.replaceIcon('d-topic-share', 'share-alt');
    api.replaceIcon("far-beer", "beer");
</script>
2 « J'aime »

C’est super ! Je peux enfin utiliser l’icône que je veux pour une catégorie :tada:

6 « J'aime »

Cela semble lié à Making tags look like real world tags - #11 by HeyRR… si vous utilisez du CSS comme content: "\f02b"; alors oui, vous en aurez toujours besoin. Ceci utilise la police d’icônes séparément de notre implémentation (qui utilise directement des fichiers SVG).

Cela n’a pas besoin d’être modifié immédiatement, mais sur la base de la liste des renommages, vous devriez remplacer share-alt par share-nodes et beer par beer-mug-empty à un moment donné dans les 6 prochains mois (la chope de bière pleine est une icône pro… je suppose que ce n’est pas « gratuit comme la bière »).

6 « J'aime »

Peut-être. C’était quelque chose qui a été conseillé plus d’une fois il y a quelques années. Je n’ai jamais vraiment compris pourquoi, mais je peux copier-coller :squinting_face_with_tongue: Mais ça a quelque chose à voir avec la possibilité d’utiliser Font Awesome quelque part, n’importe où ou quelque chose comme ça.

Mais si je ne peux plus utiliser de bière, je vais déclencher une mutinerie avec l’armée des moomins :rofl:

3 « J'aime »

Pour le moment, les icônes de bouclier sont manquantes ici sur Meta.

6 « J'aime »

Corrigé :tada:

7 « J'aime »

Merci, il n’est pas clair pour moi si la mise à niveau vers la version 6 a été effectuée ou sera effectuée ? (Je n’ai pas pu trouver l’icône « bluesky » :butterfly: version 6 après la mise à niveau de mon site, c’est pourquoi je demande…)

1 « J'aime »

Une fois que vous aurez mis à jour votre site, vos icônes seront FA6 et automatiquement remappées par Discourse.

2 « J'aime »

Oui, c’est ce à quoi je m’attendais, mais cette icône ne peut pas s’afficher (je l’utilise dans le composant de liens d’icônes d’en-tête)

1 « J'aime »

J’ai trouvé l’icône dans la version 6.6.0

Comme ce n’est pas une icône utilisée dans Discourse, est-elle dans votre svg icon subset dans les paramètres du site ?

1 « J'aime »

Non, je l’ajoute avec cette syntaxe : « fa-bluesky » dans les ressources du composant, mais ce n’est pas suffisant. Je vais regarder ce truc de ressources svg, je ne suis pas familier avec ça.

(mise à jour), apparemment nous parlons de la même chose, oui c’est ajouté dans les ressources…

1 « J'aime »

vous devrez peut-être utiliser fab-bluesky, car cela fait partie de l’ensemble de marques

5 « J'aime »

Merci, cela fonctionne en spécifiant fab-bluesky dans les ressources svg et dans l’éditeur de liens d’en-tête personnalisé, ce que je n’avais jamais eu à faire auparavant. Dans le composant de liens d’en-tête personnalisé, je n’ai jamais spécifié le préfixe “fa”, pour l’icône bluesky j’ai dû spécifier “fab-bluesky”. L’essentiel est que cela fonctionne ! Merci.

2 « J'aime »

J’ai mis à jour et les icônes ont changé. Ce qui me dérangeait le plus, parce que j’ai un peu peur de mes utilisateurs (ces dames sont merveilleuses, mais si elles s’énervent…), c’est ce qui se passe avec les réactions, mais c’est un autre monde, n’est-ce pas ? Quoi qu’il en soit, tout s’est bien passé.

4 « J'aime »

On dirait une mise à niveau intéressante ! J’adore l’arrondi mis à jour. Je ne savais pas que c’était un changement que je voulais.

2 « J'aime »

Le plus important est que la nouvelle version utilise le logo Fedora correct au lieu d’une approximation non autorisée qui donnait des aneurysmes à nos designers.

11 « J'aime »

9 messages ont été déplacées vers un nouveau sujet : Certaines icônes ne s’affichent pas après la mise à niveau

Les composants de thème officiels pour les icônes de catégorie et les icônes de tag seront-ils mis à jour pour utiliser les nouveaux noms de Font Awesome 6 ?

Je pense qu’ils utilisent encore actuellement FA5.

3 « J'aime »

Ces composants de thème utilisent le système d’icônes intégré à Discourse, je ne pense donc pas qu’ils auront besoin d’une mise à jour pour être compatibles — ils devraient utiliser automatiquement les nouvelles icônes.

7 « J'aime »