要望:投稿バッジ獲得時の視覚的表示

カスタマイズ(エフェクトなど)にCSSの知識が必要なのは構いませんが、初期の表示/非表示機能や、どのバッジを含めるか/除外するかは設定で利用できるようにすべきです。

「いいね!」 7

これがいかなる場合にも不可能なDiscourseホスティングプランがあると思います。また、多くの管理者はGitHubからインストールしたテーマにCSSを追加するのに苦労しています。
しかし、私のポイントは、まずCSSが存在し、それを簡単に非表示にできることに気づく必要があるという事実に焦点を当てていました。ドキュメントは確かに役立ちますが、私の経験ではほとんどの人はそれを読みません。

「Powered by Discourse」リンクを無効にする設定があるのはなぜですか?CSSで簡単に非表示にすることもできます。

「いいね!」 6

追加のフィードバックをいただき、ありがとうございます!本日、設定の追加を調査します。:slightly_smiling_face:

「いいね!」 4

設定の追加について、最初のドラフトを提示します。

グローバル設定

バッジごとの設定

設定自体は非常に単純ですが、動作は私が望むよりも少し複雑です。公開すべきでない情報が表示されるのを避けるため、現在、投稿にバッジを表示するには、次の 3 つの設定を有効にする必要があります。

  1. 公開バッジページにバッジを表示する
  2. バッジページにバッジを付与した投稿を表示する
  3. バッジが付与された投稿にバッジを表示する

それぞれの理由は次のとおりです。

  1. 公開バッジページにバッジが表示されない場合に、投稿にバッジを表示するのは矛盾しているように思えます。
  2. バッジページに投稿が表示されない場合に、投稿にバッジを表示するのは情報漏洩の可能性があるように思えます。
  3. これは、バッジを投稿に表示できるようにするための新しい設定です。

この新しいオプションが既存のオプションが有効になっていることに依存することを許容できると仮定すると、Discourse の全体的なデザイン言語に大きく依存するいくつかの質問が生じます。そのため、@chapoi さん、追加のフィードバックをいただけると幸いです。

特に、1 つの設定が他の設定が有効になるまで効果がないことを Discourse 管理画面でどのように表示するのが適切でしょうか?

関連する質問として、システムバッジで最初の 2 つのオプションの両方が有効になっていない場合、これらのオプションはシステムバッジでは読み取り専用であるため、新しいオプションは決して機能しません。これらのバッジでは読み取り専用の設定としてマークし、他のすべてのシステムバッジでは設定可能のままにしておくのは適切でしょうか?

最後に、興味のあるすべての人への質問ですが、どのシステムバッジでこのオプションをデフォルトで有効にするべきでしょうか?

「いいね!」 3

非常に良い点ですね。詳しく掘り下げていただきありがとうございます!

はい、その方向で合っていると思います。

現状では、構造化されたアプローチが不足していると思います。

以下のようなものが必要になると思います。

ただし、コピーはもっと良くする必要がありますね。 :sweat_smile:

どう思いますか @ella (私たちの管理デザインリード)

「いいね!」 2

チャーリー、アイデアをありがとう。うまくいくと思うよ。

Discourseの管理画面でこのようなUIの例が見つからなかったので、自分で作成しました。もう少し洗練させる必要(そして、より良いコピーが必要!)がありますが、どのように機能するか大まかなアイデアを与えるには十分だと思います。:grinning_face_with_smiling_eyes:

「いいね!」 4

投稿カテゴリにあるものが良いと思います。

「いいね!」 3

確かに、ここに構造を追加すると、これがはるかに明確になります。たとえば次のようになります。

使用法

  • バッジをタイトルとして使用できるようにする
  • 複数回付与可能

表示

  • 公開バッジページにバッジを表示する
  • バッジ付与投稿をバッジページに表示する
  • 付与された投稿にバッジを表示する

ツールチップについては、次のようにします。

「公開バッジページにバッジを表示する」と「バッジ付与投稿をバッジページに表示する」の両方が有効になっている必要があります。

「いいね!」 4

朗報です!

このPR がマージされました!

「いいね!」 3

@ganncamp あなたのサイトにもデプロイしました。:slightly_smiling_face:

「いいね!」 2

これは素晴らしいニュースです!!! ありがとう!

「いいね!」 2

わかりました…タダより高いものはない…

表示は少し期待外れです。

Selection_2150

CSSで何とかしてみます。

CSSを追加するための編集

//投稿に表示されるバッジを大きくする
.topic-meta-data .user-badge-buttons {
transform: scale(1.3);
margin-left: 0px;
}

そして、CSSでどうにもできないのは順序です。表示名とユーザー名の間にバッジがあるのには驚きました。それは変更できますか?

「いいね!」 3

フィードバックありがとうございます、@ganncamp:slightly_smiling_face:

おっしゃる通り、ユーザー名と表示名の間に表示されるのは少し奇妙に見えますね。対処法を検討します。

順序の変更についてですが、その問題について言及されているのでしょうか、それとも複数のバッジが1つの投稿に付与された場合のバッジの順序も変更したいということでしょうか?

「いいね!」 1

承知いたしました。このPRで少し変更を加えました。

投稿ヘッダーオプションのバリエーションをいくつかスクリーンショットでご紹介します。




「いいね!」 1

はい。バッジの順序については(今のところ:sweat_smile:)気にしておりません。

サイトの調整をマージしてデプロイしました。@ganncamp さん! :slightly_smiling_face:

「いいね!」 4

ありがとうございます!

参考までに、最終的なCSSはこちらです。

// バッジを大きく、より派手に見せる
.topic-meta-data .user-badge-buttons .svg-icon {
     transform: scale(1.3);
     // こちらが「より派手」な部分です
     border-radius: 50%;
     background-color: var(--highlight-bg);
     border-width: 2px;
     border-style: solid;
     border-color: var(--highlight);
     padding: 4px;
}

結果:
Selection_2162

「いいね!」 4

このトピックは2日後に自動的に閉じられました。返信はもう受け付けられません。