Nの後ろのタグを非表示にし、カテゴリのように「+X件の追加」を表示する方法

サポート
1

こんにちは皆さん、

トピックを扱っていますが、トピックによってはタグが多くなることがあります（ICSフィードから機械生成されたものも多数あります）。DiscourseのUIでは、タグは折り返され続けるため、トピックリストが非常に高くなり、スキミングが難しくなります。

トピックリストでのカテゴリの表示方法に似たことをしたいと考えています。

  • 最初の数個（例えば5個）を表示する
  • その後、「+X件追加」インジケーターの後ろに折りたたむ

試したこと：

  • CSSで一定数以降のタグを非表示にし、「…」という静的なマーカーを追加することができます。例：
/* 5番目以降のタグをすべて非表示にする */
.topic-list .discourse-tags a:nth-of-type(n+6) {
  display: none;
}

/* 5番目の後に「…」を追加する */
.topic-list .discourse-tags a:nth-of-type(5)::after {
  content: " …";
}

これは非表示には機能しますが、CSSでは動的に非表示になった数をカウントできないため、「+3件追加」という表示はできません。

私の質問：

  • トピックごとのタグ表示を制限する組み込みの方法はありますか？
  • もしなければ、カテゴリのレンダリングからのスニペット例を適応させて、「+X件追加」ロジックをタグに追加できるテーマコンポーネントはありますか？

よろしくお願いします！

「いいね！」 1
2

それを解決できましたか？コアのDiscourseではサポートされていませんが、テーマコンポーネントを使用すればおそらく可能です。

トピックあたりの最大タグ数max tags per topicというデフォルト設定があり、デフォルトは20です。これは妥当なデフォルトであり、過剰な折り返しを引き起こさないと思います。いずれにしても、それほど多くのタグを必要とするケースは稀だと思います。

3

:eyes:
20？

4

はい、おっしゃる通りです！私のサイトでは20に増やしていました。デフォルトの5は完全に妥当な値です。

あなたの鋭い観察眼にはいつも驚かされます。

「いいね！」 1
5

はい、私のインポータースクリプトは、非表示のHTML UIDマーカーを作成するため、UIDタグ作成の短縮を無効にしています。

6

このトピックは、最後の返信から14日後に自動的にクローズされました。新しい返信は許可されていません。