ホームページ機能

:discourse2: 概要 Homepage Feature は、コミュニティのホームページに最大 5 つのトピックを画像付きで表示します。
:eyeglasses: プレビュー Discourse Theme Creator でプレビュー
:hammer_and_wrench: リポジトリリンク https://github.com/discourse/discourse-homepage-feature-component
:open_book: Discourse テーマは初めてですか? Discourse テーマの使い方に関する初心者ガイド

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

機能

デフォルトでは、featured タグが付けられた最新の 3 つのトピックが表示され、トピックから最初の画像が取得されます。設定では、カスタムタグを選択したり、タグを非表示にしたり、カスタムタイトルを設定したり、コンポーネントの表示位置を構成したりできます。

:iphone: モバイルと小型画面

デフォルトでは、モバイル画面では 1 つだけ残るまでトピックが省略されます。

このデフォルト動作は、常にすべて表示をオンにすることで変更できます。これにより、小型画面(1000px 未満)ではコンポーネントが水平にスクロール可能になります。
最小画面(600px 未満)では、モバイルスタイル設定を変更することで、トピックをスタック表示するオプションもあります。

設定

名前 説明
featured tag
number of topics 最大幅で最大 5 つのトピックを表示
hide featured tag 有効にすると、上記で設定した「featured tag」のタグが、ユーザーがトピックを表示する際に通常非表示になります。
show on
show for
make collapsible コンポーネント全体を折りたたみ可能にする
show title 以下に設定したテキストを表示します(make_collapsible がオンの場合は常にタイトルが表示されます)
title text sort by created
show all always デフォルトでは、表示されるトピックの数が画面サイズに応じて減少し、モバイルでは 1 つのみになります。この設定にチェックを入れると、あらゆる画面サイズですべてが表示されます。
hide closed topics 終了済みトピックを特集トピックリストから非表示にする
always link to first post トピックが既読であっても、常に最初の投稿にリンクする
mobile style show_all_always がチェックされている場合、デフォルトではトピックは水平スクロールで表示されます。小型画面でのこの動作を変更し、600px 未満の画面ではスタック表示也可以选择できます。
featured content position 高度なテーマ開発:コンポーネントのプラグインアウトレットを変更します
翻訳 デフォルト
featured_topic_title

:discourse2: 当方でホストされていますか? テーマコンポーネントは、Standard、Business、Enterprise プランで利用可能です。

「いいね!」 89

みんな、これって最高!本当にありがとう。コア機能への追加が実現したら素晴らしいね。

「いいね!」 1

モバイル版の「Featured Topics」は複数形にするべきではありません。

「いいね!」 3

これは素敵ですね。すでに「注目のトピック」コンポーネントを使用していますが、これも悪くないアイデアです。

ただ、一つの提案があります:このコンポーネントをタグだけでなくリンクにも対応させてはいかがでしょうか。そうすれば、コンテンツをカテゴリや「トップ」(トレンドを表すもの)から取得させることも可能になるでしょう。個人的な意見ですが、これにより Reddit のように、ホームページにトレンドトピックの機能を搭載できます。@awesomerobot のご意見をお聞かせください。

素晴らしいコンポーネントです、ありがとうございます!少しリクエストがあります:デスクトップとモバイルでのトピックの数を調整できるようにして、画像の下に投稿者の名前を表示していただけると嬉しいです。

「いいね!」 4

船のトピック用にスライドを追加したほうが良いと思います。モバイルでは一つのトピックしか表示できないためです。

船のトピックへのボタンです。

「いいね!」 1

もしかして、あなたのトピックには画像がありませんか?

素晴らしいコンポーネントですね。ホームページの見た目をとても良くしています。モバイル版でも3つのトピックを表示することは可能でしょうか?スライダーを使用するなどして。また、カテゴリごとに特集トピックを表示することも可能でしょうか?

「いいね!」 3

とても素晴らしいコンポーネントです :+1:

著者を表示するという提案に賛成です。また、以下のような機能もあればさらに良いと思います:

  • 画像のリンクが常に最新の投稿(タイトルにあるものと同様)に飛ぶようにする
  • 上記の投稿のバリエーションのように、代替レイアウトを選択できるようにする(左側に最新作成のトピック、右側に小さなトピックを配置)
  • タイトルを空に選択した場合、コンポーネントのタイトルを非表示にできるようにする
  • モバイル端末で横スクロールできるようにする(下部に小さなアイコンを表示するか、サイドに矢印を表示して、3〜4件のトピックを表示可能にする)
「いいね!」 3

このコンポーネントとユーザーカードの相互作用にバグを見つけました。

なぜか、ユーザーカードはコンポーネントがページの高さを追加していることに気づいていないようです。

以下は、テーマプレビューアからのスクリーンショットです。ユーザープロフィールをクリックするとカードが表示されます。ご覧の通り、ユーザーカードは注目トピックの存在を認識していないようです:

この問題を解決するためにいくつか試してみましたが、コンポーネントの高さがユーザーカードの位置計算に反映されていない理由がわかりません。

ありがとうございます!

「いいね!」 2

修正を含むアップデートを適用しました。

以前の実装では、マージンの結合(margin collapse)が干渉していました。これにより、ユーザーカードのトップ位置の計算がずれていました。詳細は以下のページで簡潔に説明されています:Mastering margin collapsing - CSS | MDN
これは「親要素と子要素の間にコンテンツがない場合」に関連する問題でした。

「いいね!」 9

すばらしいテーマアドオン!

回転をランダム化することは可能でしょうか?表示数を2に設定しましたが、最新のアクティビティがある2つのスレッドが表示されています。

@awesomerobot さん、こんにちは。このテーマコンポーネントは素晴らしいですね。ただ、モバイル版でもメインページで見られるように、3 つの注目のテーマがスライダーとして表示されるようにすることは可能でしょうか。メインページの見た目をより良くしてくれると思います。また、各カテゴリページにも注目のテーマを追加できると嬉しいです。ご返信をお待ちしております。また、このような素晴らしいテーマを共有してくださり、本当にありがとうございます!

「いいね!」 3

CSSのトリックをいくつか試して、モバイル端末でスクロールできるようになりました!でも縦方向だけです。横方向にする方法がわかりません :smiley:

「いいね!」 1

素晴らしいコンポーネントですね!
ただ一点、私のフォーラムでモバイル表示の場合、注目コンテンツの下に余白が多すぎるようです。

この問題を修正することは可能でしょうか?あるいは、少なくともモバイル表示では無効にすることはできますか?
よろしくお願いいたします!

「いいね!」 2

ありがとうございます、とても素晴らしいです。
モバイル版で3つをスライダーモードで表示することは可能でしょうか?

もう一つ素晴らしい機能として、カテゴリやタグの中に入ると、「おすすめ」タグをフィルタリングし、そのタグやカテゴリに特化して表示できるとさらに良いかもしれません。

いずれにせよ、これは本当に素晴らしいです。ありがとうございます。

「いいね!」 1

それは奇妙ですね、私の側ではそんなにスペースがないように見えるのですが…もしかして、他のテーマがインストールされていてそれが原因になっている可能性はありますか?(余談ですが、これはモバイルビューではなく、モバイルでデスクトップビューが表示されているように見えます)

他のテーマを無効にした状態での私のテスト結果は以下の通りです:

「いいね!」 1

こんにちは、
昨日、3 つの投稿からサムネイルが非常にうまく表示されました(2 つの投稿には画像ではなく YouTube 動画が含まれていましたが、システムがサムネイルを抽出してくれて、すべて問題なく動作していました)。

ところが今日、YouTube 動画が含まれていた 2 つの投稿のサムネイルが表示されなくなりました。既知の問題でしょうか?

https://www.tournamust.com/

問題の報告は受けていませんが、埋め込み動画との互換性はテストしていませんでした。確認して、明らかな原因がないか調べてみます。