トピックバナーコンポーネント

テーマコンポーネント
1

このコンポーネントを使用すると、任意のトピックをカスタムURLパスのバナーとしてレンダリングできます。

デフォルトの外観は非常に基本的です。スクリーンショットは、最新リストのバナーとしてのデフォルトのウェルカムトピックを示しています。

Screenshot from 2022-01-27 14-42-15
Screenshot from 2022-01-27 14-42-15892×882 70.2 KB

しかし、バナーはトピックでサポートされているさまざまなコンテンツ（絵文字、アニメーション、ビデオリンクなど）をレンダリングします。そのため、これをさまざまな方法で使用（および乱用）できます :see_no_evil:

設定では、相対URLでビューを選択し、IDでトピックを選択します。バナーを3つの異なるプラグインアウトレットのいずれかに配置し、特定のグループにのみ表示することもできます。

Screenshot from 2022-01-27 15-41-37
Screenshot from 2022-01-27 15-41-37715×702 49.1 KB

:+1: クレジット: このコンポーネントのウィジェットコードは、基本的に@awesomerobotおよび@xrav3nzによるCategory Sidebars componentのコピーです。

|||
|-|-|-|
| :hammer_and_wrench:|リポジトリ| GitHub - nolosb/discourse-topic-banners: A Discourse theme component. Renders any topic as a banner on custom url paths. |
| :question:|インストールガイド|テーマまたはテーマコンポーネントのインストール方法|

テーマコンポーネントをインストール

「いいね！」 16
2

これには投票（操作可能なもの）も含まれますか？（投稿のどこかに隠されているのではなく、誰にでも見える投票を設置できることは、私たちが非常に欠けていたことです）

「いいね！」 3
3

良い質問ですね！しかし、試してみましたが、そうではありませんでした。

Screenshot from 2022-01-27 19-20-24
Screenshot from 2022-01-27 19-20-24828×308 7.4 KB

投票はコンポーザーのプレビューと同じように表示されます。操作できず、結果も表示されません。

「いいね！」 3
4

このコンポーネントでバグを見つけました。これは、特定のグループのみのトピックを表示するように有効化および設定されている場合に発生します。

ゲストまたはそのグループ以外のユーザーがフォーラムにアクセスした場合、ページの更新が正しく機能せず、ページをブラウザで更新しても他のトピックが読み込まれません。

コンソール：

Uncaught TypeError: Cannot read properties of null (reading 'groups')
    at n.html (68eb2e30e7629f8db22df6fed8efb777b0183d8d.js?__ws=mydomain.com:114:36)
    at n.value (application-8b970b30b88888346a1f4d53543a21332202376215babe59aa315ac2054a2627.js:sourcemap:1:3239172)
    at n.value (application-8b970b30b88888346a1f4d53543a21332202376215babe59aa315ac2054a2627.js:sourcemap:1:3235241)
    at s (_vendor-0cf07f050f530b08ccc553a048b7cccd4edb486adc39b865c07d6c6c1cc57fbf.js:90601:45)
    at t.exports (_vendor-0cf07f050f530b08ccc553a048b7cccd4edb486adc39b865c07d6c6c1cc57fbf.js:90584:21)
    at m (_vendor-0cf07f050f530b08ccc553a048b7cccd4edb486adc39b865c07d6c6c1cc57fbf.js:90988:17)
    at h (_vendor-0cf07f050f530b08ccc553a048b7cccd4edb486adc39b865c07d6c6c1cc57fbf.js:90856:9)
    at d (_vendor-0cf07f050f530b08ccc553a048b7cccd4edb486adc39b865c07d6c6c1cc57fbf.js:90843:5)
    at n.rerenderWidget (application-8b970b30b88888346a1f4d53543a21332202376215babe59aa315ac2054a2627.js:sourcemap:1:1455271)
    at t.invoke (_vendor-0cf07f050f530b08ccc553a048b7cccd4edb486adc39b865c07d6c6c1cc57fbf.js:66550:16)
    at e.t.flush (_vendor-0cf07f050f530b08ccc553a048b7cccd4edb486adc39b865c07d6c6c1cc57fbf.js:66442:13)
    at e.t.flush (_vendor-0cf07f050f530b08ccc553a048b7cccd4edb486adc39b865c07d6c6c1cc57fbf.js:66646:21)
    at e.n._end (_vendor-0cf07f050f530b08ccc553a048b7cccd4edb486adc39b865c07d6c6c1cc57fbf.js:67222:34)
    at e.n.end (_vendor-0cf07f050f530b08ccc553a048b7cccd4edb486adc39b865c07d6c6c1cc57fbf.js:66908:12)
    at e.n._run (_vendor-0cf07f050f530b08ccc553a048b7cccd4edb486adc39b865c07d6c6c1cc57fbf.js:67277:16)
    at e.n._join (_vendor-0cf07f050f530b08ccc553a048b7cccd4edb486adc39b865c07d6c6c1cc57fbf.js:67251:21)
    at h (_vendor-0cf07f050f530b08ccc553a048b7cccd4edb486adc39b865c07d6c6c1cc57fbf.js:53760:28)
    at HTMLDocument.<anonymous> (_vendor-0cf07f050f530b08ccc553a048b7cccd4edb486adc39b865c07d6c6c1cc57fbf.js:53864:19)
    at l (_vendor-0cf07f050f530b08ccc553a048b7cccd4edb486adc39b865c07d6c6c1cc57fbf.js:3776:29)
    at c (_vendor-0cf07f050f530b08ccc553a048b7cccd4edb486adc39b865c07d6c6c1cc57fbf.js:3844:12)
「いいね！」 2
5

投稿ありがとうございます！ログインしていないユーザーの場合のみエラーを再現でき、その修正を追加しました。コンポーネントを更新して、もう一度試していただけますか？

「いいね！」 3
6

はい、これで動作しました！ありがとうございます！ :heart:

「いいね！」 2
7

おお、これは素晴らしいですね！各カテゴリを個別にカスタマイズできる優れたテーマコンポーネントで、公式のカテゴリバナーテーマコンポーネントよりもはるかに優れているように思えますが、間違っているかもしれません。

その意味で、カテゴリバナーを投稿のタイトルに追加すると良いかもしれません。

さらに、このコンポーネントはホームページにも利用できます。

「いいね！」 2
8

こんにちは、共有ありがとうございます！

バナーに閉じるボタンを追加する予定はありますか？

「いいね！」 1
9

コンポーネントがカテゴリバナーの良い代替になるとは限りません。いくつかの注意点があります。

  • ロードがはるかに遅くなります
  • 動的なコンテンツを保持できません。たとえば、カテゴリ名を変更しても、コンポーネントでは更新されません
  • 設定もより複雑になります

とはいえ、そのように使用する方法を見るのは興味深いです :slight_smile:

現時点では、このコンポーネントのユースケースは、あるコミュニティで拡張されたイントロトピックを提供することだけです。現時点ではコンポーネントに追加する予定はありません。

10

@manuel この件を掘り起こしています。現在 3.1.4 でテスト中です。
しかし、「グループに表示」設定は、特定のグループを追加すると機能しません。大文字と小文字を区別して試しましたが、バナートピックは表示されません。設定が空の場合は機能します。何か考えはありますか？

「いいね！」 1
11

はい、コンポーネントのリファクタリングが必要になります。コードがかなり多く、私自身ももはや使用例がありません。これを未メンテナンスとしてタグ付けすることはできますか？

@jrgong さんが何をセットアップしようとしているのか分かりませんが、おそらくこのアナウンスバーコンポーネントを試すことができるでしょう。デフォルトではバーレイアウト用にスタイル設定されていますが、少しCSSを追加してabove-main-containerのアウトレットに配置すれば、非常に似たものにすることができます。MarkdownではなくHTMLが必要です。グループ機能もありませんが、大きな利点は使い捨てできることです。

「いいね！」 3
12

@manuel ヒントありがとうございます。安定版3.2が出たら確認します。アナウンスバーのtcは3.1と互換性がありません。

「いいね！」 1
13

タグを付けました :+1:

「いいね！」 3