Мы обновляем иконки до Font Awesome 6!

[awesomerobot (Kris)]

Что такое Font Awesome?

Discourse использует бесплатный набор иконок от Font Awesome во всём интерфейсе. Вы видите их на панелях инструментов, бейджах, кнопках и т. д. Вот наша панель инструментов редактора:

С 2018 года мы используем Font Awesome 5 (оригинальное объявление), а тем временем был выпущен Font Awesome 6. В версии 6 появились новые иконки, некоторые общие обновления стиля и переименования.

Начиная с сегодняшнего дня, Discourse также начнёт использовать версию 6! А именно, версию 6.6.0. Это не приведёт к радикальным визуальным изменениям, но вы заметите некоторые различия:

Что включает это обновление?

Это обновление включает ряд переименований для повышения согласованности.

Чтобы помочь сообществам Discourse пройти через обновление, изменения будут внедрены в несколько этапов:

---

Сегодня — Font Awesome обновлён до версии 6, иконки будут автоматически переназначены

Скоро — будут включены сообщения об устаревании, чтобы помочь авторам тем и плагинов обновить имена иконок

1-й квартал 2025 года — включён административный предупреждающий баннер для всех оставшихся устареваний

1 апреля 2025 года — отмена автоматического переназначения и административного предупреждающего баннера

2 мая 2025 года — удаление сопоставления старых имён иконок и логирования уровня ошибок

---

Я вижу отсутствующую иконку, как это исправить?

1. Откройте инструменты разработчика браузера и найдите соответствующий элемент с отсутствующей иконкой.

2. Запишите текущее имя затронутой иконки и найдите правильное имя для её обновления. Сопоставление имён иконок можно найти по адресу: discourse/lib/deprecated_icon_handler.rb at fbc2cfb6185c00950da8e915b1a32546e7020913 · discourse/discourse · GitHub.

3. Обновите соответствующую тему или плагин, к которому принадлежит элемент, или уведомите её/его разработчика о необходимости обновления.

Если вам нужна помощь, пожалуйста, создайте тему в канале Support или обратитесь к вашему хостинг-провайдеру обычным способом.

Что нужно знать авторам тем и плагинов?

Методы, описанные в Introducing Font Awesome 5 and SVG icons, по-прежнему работают для добавления новых и пользовательских иконок.

Мы уже удалили переназначение старых имён, и если ваша тема или плагин всё ещё использует старые имена, вы увидите пустые места там, где раньше были некоторые иконки.

Появилось множество новых иконок!

Обновление с версии 5 до 6 добавляет сотни новых бесплатных иконок, почти 500 в общей сложности!

Вы можете просмотреть полный набор здесь; он отсортирован так, чтобы сначала показывать самые новые дополнения, а поиск очень удобен: Search Icons & Find the Perfect Design | Font Awesome

[Jagster (Jakke Flemming)]

Is this needed anymore:

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

And should this be edited:

<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>

[ondrej]

This is great! I can finally use the Icon I want for a category

[awesomerobot (Kris)]

@Jagster

Is this needed anymore:

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

Looks like this might be related to Making tags look like real world tags - #11 by HeyRR… if you’re using CSS like content: "\f02b"; then yes you’ll still need this. This is using the icon font separately from our implementation (which uses SVG files directly)

@Jagster

And should this be edited:

<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>

This doesn’t need to be edited immediately, but based on the list of renames you should replace share-alt with share-nodes and beer with beer-mug-empty at some point within the next 6 months (the filled beer mug is a pro icon… I guess it’s not “free as in beer”)

[Jagster (Jakke Flemming)]

@awesomerobot

might be related to Making tags look like real world tags - #11 by HeyRR…

Perhaps. It was something that adviced more than once some years ago. I never really understood why, but I can copy&paste But it has something to do with ability to use Font Awesome somewhere, anywhere or something.

But if I can’t use beer anymore I will start a mutiny with army of moomins

[Moin]

At the moment the shield icons are missing here at Meta.

[Moin]

Fixed

[patrickemin]

Thanks, it’s not clear to me if the upgrade to version 6 has been done or will be done? (I could’nt find the “bluesky” version 6 icon after upgrading my site, it’s why I ask…)

[ondrej]

Once you update your site, your icons will be FA6 and automatically remapped by Discourse.

[patrickemin]

Yes it’s what I expected, but this icon cannot display (I use it in the header icons links component)

[ondrej]

I’ve found the icon on 6.6.0

Font Awesome

As its not a icon used in Discourse, is it in your svg icon subset in site settings?

[patrickemin]

No, I am adding it with this syntax: “fa-bluesky” in the resources of the component, but it’s not sufficient. I’ll look at that svg resources thing, I am not familiar with that.

(update), apparently we are talking about the same thing, yes it is added in the resources…

[awesomerobot (Kris)]

you might need to do fab-bluesky, because it’s part of the brand set

[patrickemin]

Thanks it works specifying fab-bluesky in the svg resources and in the custom header links editor, which I never needed to do before. In the custom header links component, I never specified the prefix “fa”, for the bluesky icon I needed to specify “fab-bluesky”. The main thing is that it works ! Thanks.

[Jagster (Jakke Flemming)]

@Jagster

But if I can’t use beer anymore I will start a mutiny with an army of moomins

I upgraded and icons changed. The thing that was bothering me most, because I’m a bit scared of my users (those ladies are wonderful, but if they get upset…) is what happens with reactions, but that is a different world, right? Anyway, everything went smoothly.

[darkpixlz (Pyx)]

Looks like a cool upgrade! I love the updated rounding. Didn’t know it was a change I wanted.

[mattdm (Matthew Miller)]

Most importantly, the new version uses the correct Fedora logo rather than an unauthorized approximation that was giving our designers aneurisms.

[bloomexperiment (Tracey)]

Will the official Category Icons and Tag Icons theme components be updated to use the new Font Awesome 6 names?

Category Icons

This theme component is deprecated and should no longer be used. Its features are now in Discourse Core (see: Bringing popular features to Discourse). For private category icon customization, refer to this topic. Summary Category Icons allows category badge links to have icons next to the category name. Preview Preview on Discourse Theme Creator Repository Link https://github.com/discourse/discourse-category-icons …

Tag Icons

Summary Tag Icons allows tags to have an icon next to the tag label. Preview Preview on Discourse Theme Creator Repository Link https://github.com/discourse/discourse-tag-icons New to Discourse Themes? Beginner’s guide to using Discourse Themes Install this theme component Features Here is an example of how this would look, with tag style set to the default (simple): [image] Here is how this looks with tag sty…

I think they still currently use FA5

[awesomerobot (Kris)]

These theme components use the icon system built into Discourse, so I don’t believe they’ll need an update to be compatible — they should automatically use the new icons.