| 概要 | トピックオーナーの投稿にバッジを追加します。 | |
| リポジトリ | https://github.com/VaperinaDEV/author-badge-for-topic-posts | |
| インストールガイド | テーマまたはテーマコンポーネントのインストール方法 | |
| Discourseテーマ初心者の方へ | Discourseテーマの初心者向けガイド |
このテーマコンポーネントをインストール
こんにちは ![]()
このテーマコンポーネントを使用すると、トピックオーナーの投稿にバッジラベルを追加できます。トピックが大きい場合、誰が元の投稿者であるかを明確に確認できるため、非常に便利です。
フィルター
コンポーネントの構造により、モバイルビューとデスクトップビューを個別にターゲットにすることができます。さらに、各カテゴリを個別にターゲットにすることができ、どのカテゴリとビューにどの著者バッジが表示されるかをカスタマイズできます。
テーマ設定で可能です。
コンポーネントを機能させるには、3つのパラメータを追加する必要があります。
-
view-type
- desktop
- mobile
-
category-name
- 対象とするカテゴリです。例:「support」
-
author-label
- バッジラベルです。例:「Author」
例:
モバイルでは通常スペースが少ないため、モバイルで短いバージョンを追加すると便利な場合があります。
現在、discourseカテゴリに著者バッジを設定しており、デスクトップでは「Author」というテキストが表示され、モバイルでは「OP」というテキストが表示されます。
わかりました。他のカテゴリで異なるテキストを使用したい場合はどうすればよいですか?それぞれ個別に設定する必要がありますか?もちろん、そうではありません。
view-type または category-name またはその両方を空のままにした場合、既存のものを上書きせずにグローバルに適用されます。
例:
他のカテゴリのデスクトップに「Original Poster」というテキストを使用するバッジを2つ追加し、デスクトップとモバイルビューの両方で動画カテゴリに「Director」というテキストを使用するようにしました。
これを行うには、これらのセクションを空のままにします。
セミコロンをスペースなしで入力します
たとえば、すべてのカテゴリとすべてのビュータイプで「Author」のみを使用したい場合はどうなりますか。以下を使用します。
セミコロンを2つ(スペースなし)とAuthor
;;Author
場所
バッジを追加できる場所を見てみましょう…
デスクトップとモバイルビューで、テーマ設定からそれぞれ3つの場所を選択できます。
これらの2つの設定 ![]()
デスクトップ
author badge location desktop
- below-user-avatar
- after-user-names
- below-user-names
below-user-avatar(スペース制限あり:トピックのアバター幅を使用します)(固定) 短いラベルを選択することをお勧めします
after-user-names
below-user-names
モバイル
author badge location mobile
- below-user-avatar
- after-user-names
- above-user
below-user-avatar(スペース制限あり:トピックのアバター幅を使用します) 短いラベルを選択することをお勧めします
after-user-names(スペース制限あり) 短いラベルを選択することをお勧めします
above-user
カスタマイズ
最後にカスタマイズオプションを見てみましょう。
ここで、色、フォントスタイル、角などをカスタマイズして、著者バッジを作成できます。
例:
これは次の値を使用しています。
これらの色の変数は、サイトの配色によって同じ色を使用しない場合があります。
どのようなクールな著者バッジを作成するかは、あなた次第です。 ![]()














