私たちはアイコンを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をv6にアップグレード、アイコンは自動的に再マッピングされます。

近日中 - テーマ/プラグイン作成者がアイコン名を更新するのを支援するために、非推奨メッセージが有効になります。

2025年第1四半期 - 残りの非推奨項目に対して、管理者警告バナーが有効になります。

2025年4月1日 - 自動再マッピングと管理者警告バナーの削除。

2025年5月2日 - 古いアイコン名のマッピングとエラーレベルのログ記録の削除。

---

アイコンが見つからないのですが、どうすれば修正できますか？

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 Lehtonen)]

これはもう必要ですか？

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

そして、これを編集する必要がありますか？

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

これで素晴らしい！ついにカテゴリのアイコンを選べるようになりました

[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

これはもう必要ありませんか？

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

これは Making tags look like real world tags - #11 by HeyRR… に関連している可能性があります。もし content: "\\f02b"; のようなCSSを使用している場合は、はい、まだ必要です。これは、私たちの実装（SVGファイルを直接使用する）とは別にアイコンフォントを使用しています。

@Jagster

また、これを編集する必要がありますか？

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

これはすぐに編集する必要はありませんが、リネームリストによると、今後6か月以内に share-alt を share-nodes に、beer を beer-mug-empty に置き換える必要があります（塗りつぶされたビールジョッキはプロアイコンです…「free as in beer」ではないのでしょう）。

[Jagster (Jakke Lehtonen)]

@awesomerobot

Making tags look like real world tags - #11 by HeyRR に関連しているかもしれません…

そうかもしれません。それは数年前に何度も勧められたものでした。なぜなのか本当には理解できませんでしたが、コピー＆ペーストはできます😝 でも、Font Awesome をどこかで使えるようにすることに関係しているか、何かそんな感じです。

でも、もうビールが使えなくなったら、ムーミン軍団と一緒に反乱を起こしますよ🤣

[Moin]

現在、Metaではシールドアイコンが表示されません。

[Moin]

修正しました

[patrickemin]

アップグレードがバージョン6に完了したのか、それともこれから行われるのか、私にはわかりません。（サイトをアップグレードした後、「bluesky」 バージョン6のアイコンが見つからなかったので、質問しています…）

[ondrej]

サイトを更新すると、アイコンはFA6になり、Discourseによって自動的に再マッピングされます。

[patrickemin]

はい、予想通りです。しかし、このアイコンは表示できません（ヘッダーアイコンリンクコンポーネントで使用しています）。

[ondrej]

6.6.0 でアイコンを見つけました。

Font Awesome

これは Discourse で使用されていないアイコンですが、サイト設定の svg アイコンサブセット に含まれていますか？

[patrickemin]

いいえ、コンポーネントのリソースに「fa-bluesky」という構文で追加していますが、それだけでは不十分です。SVGリソースについて調べてみます。あまり詳しくありません。

（更新）どうやら同じことを話しているようです。はい、リソースに追加されています…

[awesomerobot (Kris)]

ブランドセットの一部ですので、fab-blueskyを行う必要があるかもしれません。

[patrickemin]

svg リソースとカスタムヘッダーリンクエディターで fab-bluesky を指定すると機能するようになりました。以前は必要ありませんでした。カスタムヘッダーリンクコンポーネントでは、プレフィックス「fa」を指定したことはありませんでしたが、bluesky アイコンでは「fab-bluesky」を指定する必要がありました。とにかく、機能したので良かったです。ありがとうございます。

[Jagster (Jakke Lehtonen)]

@Jagster

しかし、もうビールが使えなくなったら、ムーミンの軍隊で反乱を起こしますよ

アップグレードしたらアイコンが変わりました。一番気になっていたのは、ユーザー（あの女性たちは素晴らしいですが、怒らせると…）が怖いので、リアクションはどうなるのかということでしたが、それはまた別の話ですよね？とにかく、すべて順調に進みました。

[darkpixlz (Pyx)]

クールなアップグレードですね！更新された丸め処理が気に入りました。それが欲しかった変更だとは知りませんでした。

[mattdm (Matthew Miller)]

最も重要なのは、新しいバージョンでは、デザイナーを苦しめていた不正な近似ではなく、正しいFedoraロゴが使用されていることです。

[bloomexperiment (Tracey)]

公式のカテゴリアイコンとタグアイコンのテーマコンポーネントは、新しいFont Awesome 6の名前に更新されますか？

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…

現在もFA5を使用していると思われます。

[awesomerobot (Kris)]

これらのテーマコンポーネントは、Discourse に組み込まれているアイコンシステムを使用しているため、互換性のために更新する必要はないと思われます。新しいアイコンが自動的に使用されるはずです。