 |
概要 | タグアイコンは、タグラベルの横にアイコンを表示できるようにします。 |
 |
プレビュー | Discourse Theme Creator でプレビュー |
 |
リポジトリリンク | https://github.com/discourse/discourse-tag-icons |
 |
Discourse テーマが初めての方へ | Discourse テーマの使い方の初心者ガイド |
このテーマコンポーネントをインストール
デフォルトのタグスタイル（シンプル）に設定した場合の例を以下に示します：
box スタイルに設定した場合の表示例：
| 名前 | 説明 |
|---|---|
| tag icon list | タグのコンマ区切り設定を入力します。形式は「tag-slug,icon,iconColor」です。アイコンカラーは省略可能です。 |
| svg icons | このテーマコンポーネントで使用される FontAwesome 6 アイコンのリスト |
当方でホストされていますか？ テーマコンポーネントは、Standard、Business、Enterprise プランで利用可能です。
Does this also work with custom svg?
Yes, but you would need to register the custom SVG in a plugin (themes should soon also be able to add custom icons to the SVG sprite set). See Introducing Font Awesome 5 and SVG icons for details.
Now that custom icons in themes has been merged is it possible to use FA Pro icons with this or does the component need to be updated?
Component doesn’t need to be updated, if you add custom icons via theme/plugin they will be available to the component.
これによりタグにカスタムアイコンを追加できますが、タグのボックスの色を変更したい場合はどうすればよいでしょうか？
CSS でそれを実現できます。例えば、以下のコードは「theme-component」のテキスト色を赤に設定します：
.extra-info-wrapper .discourse-tag[data-tag-name="theme-component"] {
color: red !important;
}
（これはあくまで例示のためのものであり、ご自身で適切な CSS を作成する必要があります。）
ありがとうございます。CSS ですべてのタグを名前付きでリストアップし、色を指定する必要がありますね。でも、アイコンのように管理画面でコンポーネントのテーマ設定と同じように、カンマ区切りのリストと16進数カラーコードを指定できればいいのですが。
タググループ内のすべてのタグに色を設定する方法はありますか？
私はこのような結果になりました：
（デフォルトのタグアイコンもまだ残っています）
このような結果を見た方はいますか？
サイト設定で「タグスタイル」を探し、シンプルに変更してください。これでグレーの箇条書きが削除されます。
なるほど、ありがとうございます。ただし、他のすべてのタグにはデフォルトのグレーの箇条書き記号が必要です。特定のタグの箇条書きを削除することでこれを達成しました：
a[data-tag-name="test1"]::before {
display:none!important;
}
素晴らしい調整ですね。著者への質問です。私は、言語別に投稿をタグ付けする際に（「castellano」や「deutsch」などのタグを使っています）、現在の地味なタグに小さな国旗を付けて彩りを加えたいと考えています。上記のようにカスタムの.svgをアップロードするのが良い方法でしょうか、それとも事前に設定されたアイコンセットや、Discourseに標準搭載されている絵文字セットを利用できるでしょうか？
国旗には絵文字を使うのが自然ですが、このコンポーネントは絵文字ではなく Font Awesome などのアイコンセットからアイコンを使用しています。
タグのラベルに直接絵文字を追加することは可能です。ローカルで試してみましたが、タグにはスペースが使えない点が少し厄介です。例を以下に示します：
ダッシュを使用しても問題なければ、その方法が最適です。
おっと、それはなかなか素敵ですね。ダッシュがなければ完璧ですが、まあ許容範囲かもしれません。フラグの絵文字だけのタグを試してみる価値もあるかもしれませんね。
はい、絵文字だけでもかまいませんが、投稿時のタグドロップダウンから検索で簡単に見つけることはできません。
あと一つ、ちょっと愚かなような質問なんですが、上記のフランス語の例のように、絵文字を機能させるにはどうすればいいのでしょうか？「:sweden:-svenska」というタグを作ってみたのですが、スウェーデンの国旗には変換されませんでした。
絵文字記号を使用する必要があります（モバイルの場合は、例えば絵文字キーボードに切り替えてください）。
ああ、Discourse の絵文字のことか。なるほど、モバイル端末に切り替える必要があるんだね。これを使えると思っていたんだけど。動いたよ、ありがとう！
私の理解が正しければ、タグレンダラー内でタグがどのグループに属しているかを簡単に確認する方法はないのでしょうか？
これは非常に素晴らしい提案です。以前はカスタム CSS で対応していましたが、このテーマコンポーネントに切り替えました。その際、設定されていないすべてのタグに対して フォールバックアイコン を使用していました（少なくともタググループのサポート以前は）。そして、私が最も欠けているのがこれです。
discourse-category-icons がこの機能をサポートしていることを考えると、replaceCategoryLinkRenderer が置き換えるレンダラーはカテゴリドロップダウンで使用されているが、replaceTagRenderer が置き換えるレンダラーはタグドロップダウンでは使用されていない、と推測してよろしいでしょうか？つまり、これはコアの変更が必要になるかもしれません？コンポーザー内のタグドロップダウンは、アイコン付きの置き換えられたレンダラーを使用しています。
