トピック絞り込み一覧

テーマコンポーネント
1
:information_source: 概要 フィルターを使用してカスタムトピックリストを作成できます。リストは、選択したページで、選択したプラグインのアウトレットに表示できます。
:eyeglasses: プレビュー Theme Creator
: hammer_and_wrench: リポジトリ https://github.com/gormus/discourse-filtered-topic-lists
: question: インストールガイド テーマまたはテーマコンポーネントのインストール方法
: open_book: Discourseテーマ初心者の方へ Discourseテーマ使用の初心者ガイド

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

トピックフィルターを使用してカスタムトピックリストを作成できます。リストは、選択したページで、選択したプラグインのアウトレットに表示できます。

必要な数のリストを作成し、その見出し、表示するトピック数、クエリに使用するフィルター、そして最も重要なこととして、どのページに、そのページのどこに表示するかを定義できます。

Edit preset settings
Edit preset settings1410×940 95.5 KB

実験的なトピックリストフィルター機能とサポートされているフィルターを確認してください。

設定

  • タイトル: オプションの見出しテキスト。指定すると、トピックリストの上に表示されます。

  • 長さ: 表示するトピックの数。

  • クエリ: リストをフィルターするためのクエリ。

  • プラグインアウトレット: キュレーションされたトピックリストは、次のプラグインアウトレット/リージョンに配置できます。

    • below-site-header
    • above-main-container
    • before-topic-list
    • after-topic-list
    • topic-list-bottom
    • main-outlet-bottom
    • before-main-outlet

  • 表示場所: リストを表示するページ。

    • everywhere: すべてのページ（/adminページを除く）に表示します。
    • homepage
    • top_menu: 有効なページについては、トップメニューの設定を確認してください。
    • categories: /categoriesページ。
    • latest: /latestページ。
    • top
    • new
    • unread
    • read
    • posted
    • bookmarks
    • hot
    • selected_categories:
    • selected_tags

  • 選択したカテゴリ: 表示場所設定がselected_categoriesに設定されている場合、このフィールドで選択されたカテゴリが使用されます。トピックリストはこれらのカテゴリページにのみ表示されます。

  • 選択したタグ: 表示場所設定がselected_tagsに設定されている場合、このフィールドで選択されたタグが使用されます。トピックリストはこれらのタグページにのみ表示されます。

プラグインアウトレット

すべての利用可能なプラグインアウトレットは、周りに赤い破線でレンダリングされます。

All available plugin outlets
All available plugin outlets1920×2623 227 KB

インスピレーション

Featured Listsテーマコンポーネントに触発されました。しかし、最終的には、私のプロジェクトのために、より意見に左右されず、より柔軟なソリューションが必要でした。

ぜひチェックしてみてください：

「いいね！」 23
2

これはかなりクールですね。

コンポーネントをスタイル設定できるように、同じターゲット可能なクラスを使用しますか？

いくつかのコンセントにカスタムリストのサンプルをいくつか追加していただけますか？

ありがとうございます。

「いいね！」 1
3

はい、フィルターされたトピックリストテーブルは、メインのトピックリストテーブルと同じCSSクラスを使用します。さらに、ラッパーとなるDIV要素にはクラスがあり、これによりプラグインのアウトレットでトピックリストテーブルをカスタマイズできます。

以下に階層を示します。.topic-list はTABLE要素のデフォルト識別子です。必要に応じて、特定のプラグインアウトレットをターゲットにして異なるスタイルを適用することもできます。2番目のコードブロックを参照してください。

.filtered-topics-list {
    &__wrapper {
    }

    &__header {
        h2 {
        }
    }

    &__content.topic-list {
    }
}

.filtered-topics-list {
    &.below-site-header,
    &.above-main-container,
    &.before-topic-list,
    &.after-topic-list,
    &.topic-list-bottom,
    &.main-outlet-bottom,
    &.before-main-outlet {

        &__wrapper {
        }

        &__header {
            h2 {
            }
        }

        &__content.topic-list {
        }
    }
}

デモサイトはありませんが、さまざまなフィルターされたトピックリストを含む、利用可能なすべてのプラグインアウトレットを表示するスクリーンショットを共有しました。

それらの周りの赤い破線は無視してください。テーブルとその領域を強調するためにのみ追加しました。

「いいね！」 2
4

ホームページとして /latest を使用しています。このコンポーネントを使用して特定のカテゴリから最新トピックをホームページに追加しましたが、標準の無限スクロールの Discourse の最新トピックコンポーネントを削除したいと考えています。CSS でこれを行いましたが、他のページにも影響が出ています。ホームページのみを CSS セレクターで最新トピックコンポーネントにターゲット設定することは可能ですか？

「いいね！」 3
5

ルートをクエリし、JavaScriptを使用してカスタムクラスを追加する必要があると思います。以下に、従うことができる例を示します。

https://gitlab.com/manuelkostka/discourse/helpers/css-classes/-/blob/main/javascripts/discourse/api-initializers/css-classes.js?ref_type=heads

「いいね！」 3
6

バグを発見しました（または期待される動作でしょうか？）：

カテゴリで デフォルトのリストフィルター：サブカテゴリなし を設定すると、どのコンセントでもフィルターされたトピックリストが表示されなくなります。

最新の安定版 3.3.1 でテスト済みです。

「いいね！」 3
7

@jrgong さん、プリセットのスクリーンショットを共有していただけますか？

「いいね！」 2
8

PMを送りました。プリセットはこちらです。

9

もう一つ質問があります。特定のカテゴリでフィルタリングされたリストを表示する際に、コアトピックリストを非表示にする最善の方法は何でしょうか？

CSSで私が見つけた唯一の方法は、spanタグをターゲットにすることですが、これはさまざまな場合にトリガーされる可能性があります。

span + table.topic-list.topic-thumbnails-grid {
  display: none;
}
10

@jrgong さん、ご報告ありがとうございます。確認いたしました。

再現手順：

  1. カテゴリとサブカテゴリを作成します。例：トップレベルカテゴリ と トップレベルカテゴリ > サブカテゴリ
  2. トップレベルカテゴリ の設定を編集します（/c/top-level-category/edit/settings）。
  3. 「表示」セクションで デフォルトのリストフィルター 設定を見つけます。
  4. 値を すべてのトピック から サブカテゴリなし に変更します。
  5. フィルタリングされたトピックリストコンポーネントで新しいプリセットを設定し、トップレベルカテゴリとサブカテゴリの両方にコンテンツを表示するようにします。
    1. 表示対象 = selected_categories を設定します。
    2. 選択されたカテゴリ = トップレベルカテゴリ, サブカテゴリ を設定します。
    3. プラグインのアウトレット = (任意) を設定します。
  6. 各カテゴリページを表示します。

期待される結果：

両方のカテゴリページに、選択されたプラグインアウトレットに設定されたプリセットの結果が表示されること。

発見されたこと：

  1. デフォルトのリストフィルター = サブカテゴリなし が設定されているカテゴリでは、サブカテゴリの有無にかかわらず、フィルタリングされたトピックリストが表示されません。
  2. ただし、表示対象 = everywhere を設定すると、フィルタリングされたトピックリストが選択されたアウトレットに表示されます。

類似の問題：

「いいね！」 2
11

カスタムフィールドを追加した際、例えばXという名前のフィルターを10個の最近のトピックで作成し、それら10個のトピックをスクロールして、例えば「最新」から開始した場合、それらのトピックの1つ以上がまだ存在する場合、両方に表示されます。それらを「最新」またはフィルターから非表示にする方法はありますか？

「いいね！」 1
12

素晴らしいプラグイン機能です！:+1:

Q: プラグインのアウトレット : before-main-outlet

これを表示するにはどうすればよいですか？見当たりません。Layton GFXのように画面の右側に配置するために、標準テーマで何かを有効/無効にする必要がありますか？

13

うーん、見つけました。少なくとも一瞬ですが、無限スクロールの下部に表示されており、予想されていた、あるいは期待されていたビジュアルガイドの右側ではありません。