 |
概要 | 選択されたビューにおける機能カテゴリ。 |
 |
リポジトリリンク | Manuel Kostka / Discourse / Components / Featured Categories · GitLab |
 |
Discourse テーマが初めての方へ | Discourse テーマの利用に関する初心者ガイド |
このテーマコンポーネントをインストール
上記の 2 つのレイアウトから切り替えるか、なしを選択して独自のスタイルを定義することもできます。また、コンポーネントのルートとアウトレットを設定することも可能です。
.featured-categories {
&__container {
}
&__heading {
}
&__list-container {
}
&__category-container {
}
&__category-link {
.category-logo {}
.category-name {}
.category-description {}
}
Handy TC、ありがとうございます。
ホームページでのみ表示するトグル、サイトロゴの表示、ロゴ下のサイト説明の表示といった機能の追加があると良いと思います。
現在はグローバルリスト（最新/新規/未読/トップ）に表示されています。設定にドロップダウンを追加して、表示させるグローバルページを選択できるようにしようかと考えています。ですので、はい、私が再び時間を持てたときのロードマップに入っています！
ロゴを表示させるユースケースは何でしょうか？グローバルページでは、ほぼ「ホーム」にいるようなものだと思いますが？
実際、私が最も追加したいのはモバイルビューです。まだアイデアが浮かんでいないため、現在はモバイルでは表示されていません。アイデアがあれば共有してください！
パーソナライズされた見た目を提供し、短い説明文と組み合わせることで、新規訪問者に対してコミュニティの概要を素早く伝え、既存ユーザーにはコミュニティのミッションを思い起こさせる役割を果たします。リンクの上部または左側に配置します。
これをグローバルリンクにデフォルトで表示し、カテゴリー（およびタグページ？）ごとにオプションで表示できるようにすることで、優先度の高いエリアへの便利なナビゲーションメニューとして機能させることを主たる目的としています（ちなみに、カテゴリーだけでなくカスタムリンクを含める機能も、望ましい機能の一つです）。
個人的には、多くの Discourse サイトは特に初回訪問時に曖昧な印象を与えがちで、デフォルトの Discourse ナビゲーションは平均的なユーザーにとって混乱を招くことがあると感じています。一般的に、私のサイトは多くのエリアの中から数カ所だけを優先的に設計しており、これらの提案された追加機能によって、平均的なユーザーにとってそれらの優先エリアが明確になり、かつアクセスしやすくなるでしょう。
優れたコンポーネントです。
Versatile Banner をインストールしました。このコンポーネントを Versatile Banner の下に移動させるにはどうすればよいでしょうか？
つまり、Versatile Banner が最初に表示され、その後にご社のコンポーネントが表示されるようにしたいのです。
よろしくお願いいたします。
はい、両方のコンポーネントは同じアウトレットでレンダリングされます。その場合、要素の順序がどうなるのかの原因はわかりません。私のサイトではデフォルトではバナーの下に表示されます。
ただし、CSS宣言で順序を制御できるはずです：
.below-site-header-outlet.categories-header {
order: -1 !important;
}
.below-site-header-outlet.banner-themes {
order: -2 !important;
}
それは多くのカスタムオプションを意味するように聞こえますね。このコンポーネントにそのような多くのロジックを追加したくはありません。
「注目のナビゲーション」の構築は、カスタム HTML バナーのユースケースとしてより適切だと考えます。画像とタイトル付きのリンクがいくつかあれば十分です。
その点には同意します！訪問者向けと新規登録ユーザー向けの専用バナーは、親切で歓迎の気持ちを示すのに役立つと思います。
「Versatile Banner」の設定に「デフォルト配置の入れ替え」というオプションがあります。これが役立つでしょうか？
デフォルト配置の入れ替え
他のバナー関連コンポーネントがアクティブな場合、これを使ってその位置と「Versatile Banner」の位置を入れ替えることができます。
この設定を試してみてください。私には効果がありませんでした 
テーマコンポーネントをインストールしましたが、メインコンテンツ内に収まらず、場違い（醜い）に見えます。エアテーマを使用しています。
コンポーネントをダークカラーのコンテナ内に表示するには、どこを編集すればよいか教えていただけますか？
このようになります。
このように表示したいです。
こんにちは。
Discourseとテーマ設定を始めたばかりです。
ここで見られるような、トップにカードのようなものを表示したいです：Secret World Legends - Funcom Forums
このテーマコンポーネントは、その方向性には役立つようです。
インストールして、表示したいカテゴリを選択できましたが、タイトルしか表示されませんでした。
まだ画像を設定していないので、当然のことです。
私の質問（おそらく誰も尋ねていないので、愚かな質問でしょう）は、カテゴリの画像を設定するにはどうすればよいですか？
そして、それらを「アップロード」するにはどうすればよいですか？
どんな助けでも感謝します。
Discourse は初めてなので、Featured Categories Header について質問があります。
これを実現しようとしていますが、できません。
数行のコードが提供されています。
html.categories-header{
.below-site-header-outlet.categories-header {
.wrap {
.categories-header-item {
[各アイテムのリンク、ロゴ、名前...]
}
}
}
}
アイテムのリンク、ロゴ、名前をどのように指定できますか？
どなたか明確にしていただけますか？
よろしくお願いします。
こんにちは、ようこそ 
例のような画像を表示したい場合は、テーマコンポーネントの設定で関連するカテゴリを選択し、それぞれに画像が割り当てられていることを確認する必要があります（カテゴリ設定 → 画像 → カテゴリロゴ画像）。
そのようなものですか？
もしそうなら、このCSSを試してみてください。テーマCSSまたはコンポーネントに追加してください。
内部では、制御できる変数を確認できます。
列数、要素間のギャップ、各要素の幅を選択できます。
要素は自動的にスタックされます。
.below-site-header-outlet.categories-header > div.wrap {
--ch-columns: 6;
--ch-gap: 2.5em;
--ch-width: 110px;
display: grid !important;
grid-template-columns: repeat(auto-fill, minmax(var(--ch-width), 0fr));
gap: var(--ch-gap) !important;
max-width: calc(var(--ch-columns) * var(--ch-width) + ((var(--ch-columns) - 1) * var(--ch-gap))) !important;
}
こんな感じを試してみてください。
.below-site-header-outlet.categories-header > div.wrap {
--ch-columns: 4;
--ch-gap-row: 2em;
--ch-gap-col: 6em;
--ch-width: 120px;
& > div {
width: var(--ch-width);
}
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
align-items: center;
max-width: calc(var(--ch-columns) * var(--ch-width) + ((var(--ch-columns) - 1) * var(--ch-gap-col))) !important;
}