カテゴリ:スマートフォン表示コンポーネント

テーマコンポーネント(カテゴリ:スマートフォンビュー)を実装すると、下の例の画像のようにカテゴリをスマートフォンのアイコンとして表示できるようになり、便利だと思います。いかがでしょうか。

「いいね!」 2

クリスティアンさん、おかえりなさい :v:

タイトルやカテゴリの説明にはあまりスペースがなくなります。これらはデフォルトで匿名ユーザーや信頼レベル0のユーザー向けに有効になっています。実際の例を使ったモックアップがあれば、どのように機能するかを見るのに役立ちます。

それは同じではありませんが、私は自分のフォーラムでモバイルカテゴリページのレイアウトを変更しました。

から:

しかし、あなたが提案するようにグリッドビューを使用したり、カテゴリごとに3つのトピックを削除したりすることで、さらに改善できると思います。

OPのモックアップは、スマートフォンと同じ問題を抱えています。

  • 何が何であるかを識別し、記憶する方法。
  • 多すぎるとどうなるか。

こんにちは🙋🏼‍♂️ スマートフォン表示でこのスタイル(下の画像)を許可するだけで十分です。カテゴリの説明、サブカテゴリのリスト、最新の投稿のリストを無効にする機能もあればなお良いです。そして、スマートフォンのアプリリストのようにカテゴリリストを利用できるようにします(グリッドバージョン - 角丸の四角形)。

もう1つの便利な機能は、「スマートフォン表示でのカスタムカテゴリ名」です。これにより、たとえば「Entertainment」を「ENT」のようにカテゴリ名を短縮できます。

これはフォーラムで見つけた例ですが、リスト形式です。

「いいね!」 4

なぜそれが機能するのでしょうか?ENTが何を意味するのか誰も知りません。

これが機能する状況は想像できます。特定のゲームやニッチな興味を持つファンは、独自の専門用語やシンボルを持っていることがよくあります。新規ユーザーにとって最も発見しやすく、分かりやすいでしょうか?おそらくそうではありませんが、それは必ずしも重要な価値ではありません。

「いいね!」 1

参照できるようにアクセスリンクを共有していただけますか。または、https://businesslab.vn の私のサイトもご覧いただけます。私が知っていること、そして行ってきたことを喜んで共有します。
また、お探しのものに似ていると思ったテーマのカテゴリページ Air Theme も参照できます。

「いいね!」 1

カテゴリページのナビゲーションについてお話ししています。カテゴリを見つけるために下にスクロールするのではなく、最初の投稿で説明したように、すべてを 1 ページで見られるようにすると便利です。将来の Discourse のバージョンでは、この機能が実装されることは避けられないので、なぜ先取りしないのでしょうか?

はい、最初の投稿で最後に投稿した画像のように、それは間違いなく問題を部分的に解決します。
テーマコンポーネントは GitHub - discourse/discourse-minimal-category-boxes です。

この議論はよく理解できません。なぜ避けられないのですか?(もしそうなら、なぜ急ぐのですか?)

「いいね!」 1

Customization > Theme のサムネイルのグリッドレイアウトでは、すでにそのようになっています。

つまり、ある種の実現は可能ですね。もしかしたら、ショートプレス/ロングプレスやシングルタップ/ダブルタップというアイデアを使って、説明がポップアップ表示されるようにすることもできるかもしれません。

@Canapin

これがどれほど使いやすいかは、アプリケーション次第でしょう。正直なところ、私はモバイルでの Customization > Theme のトピックリストが使いにくく感じます。視覚的にものを見つけるのが難しくなるからです。

しかし、OPがより単純化されたカテゴリ名のアイコンと、その下にテキストがある場合、それはまあまあのものになるかもしれません。

どのくらいの数のカテゴリについて話していますか? 上記の私の投稿を参照し、Customization > Theme リンクでトピックレイアウトのサムネイルをチェックしてください。

確かに。lol

誰かが Customization > Theme componentCustomization > Plugin を作成するのは避けられないかもしれません。達成したい効果に応じて、必要なアルゴリズム次第です。

その点は認識しており、現在検討中です :+1:

気になったので、@derak さんが望んでいたような形になるよう、いくつか調整してみました:

.category-boxes, .category-boxes-with-topics {
    gap: 1em;
}
.mobile-view .category-boxes .category-box, .mobile-view .category-boxes-with-topics .category-box {
    width: 100%;
    flex: 0 0 calc(50% - 0.5em);
}
.category-boxes .description {
    display: none;
}
.category-boxes .category-box .category-box-inner .category-details .category-box-heading h3 {
    text-align: center !important;
}
.category-boxes .category-logo .category-notifications-button, .category-boxes-with-topics .category-logo .category-notifications-button {
    visibility: hidden;
}
.category-boxes .category-box {
     box-shadow: 0px 0px 8px rgba(0,0,0,.2);
}
「いいね!」 4

とてもミニマルに見えます。別のプロジェクトでこのバージョンを検討します^^

「いいね!」 2