デフォルトの /about ページは、モデレーターと管理者のみがアクセスできる情報（各ユーザーのユーザー名、名前、役職）を表示します。この About ページをカスタマイズして、各ユーザーのプロフィールの「自己紹介」セクションの内容も表示するにはどうすればよいですか？
ここでは、一般的なアイデアを理解しています。
- コンポーネントを定義する
- テンプレートを定義する
- 既存のアウトレットを利用するためのコネクタファイルを作成する
しかし、私のユースケースには、より適したアウトレットがないようです。さらに、/about のテンプレートをオーバーライドしたり、プラグイン API の modifyClass 機能を使用したりすることは推奨されないようです。そのため、どうすればよいかわかりません。ベストプラクティスについて、ご指導いただけると幸いです。よろしくお願いします！
Discourse AI は、テンプレートをオーバーライドするように勧めているようです。それは正しいと思われますか？
Discourse AI の回答
Discourse /about ページに「自己紹介」を追加する AI
aas:
デフォルトの /about ページは、モデレーターと管理者のみがアクセスできる情報（各ユーザーのユーザー名、名前、役職）を表示します。この About ページをカスタマイズして、各ユーザーのプロフィールの「自己紹介」セクションの内容も表示するにはどうすればよいですか？
ここでは、一般的なアイデアを理解しています。
Add custom content that only appears on your homepage
- コンポーネントを定義する
- テンプレートを定義する
- 既存のアウトレットを利用するためのコネクタファイルを作成する
しかし、私のユースケースには、より適したアウトレットがないようです。さらに、/about のテンプレートをオーバーライドしたり、プラグイン API の modifyClass 機能を使用したりすることは推奨されないようです。そのため、どうすればよいかわかりません。ベストプラクティスについて、ご指導いただけると幸いです。よろしくお願いします！
HelperBot:
はい、スタッフリストにユーザープロフィールの「自己紹介」セクションのような情報を含めるように /about ページをカスタマイズするためのベストプラクティスについて、調査をお手伝いできます。
コアテンプレートを直接オーバーライドしたり modifyClass を使用したりするのは複雑で、アップデートで問題が発生する可能性があるというのは、おっしゃる通りです。可能な限り、テーマコンポーネントとアウトレットを使用することが一般的に推奨されます。/about ページ自体に特定の、きめ細かなアウトレットがない可能性があるとのことですので、このページをカスタマイズしたり、ユーザーフィールドを追加したりすることに関するディスカッションを探してみましょう。
まず、/about ページをカスタマイズしてプロファイルフィールドを追加することに関するディスカッションを検索します。
Meta Discourse を検索
「customize about page profile field category:dev」で 14 件の結果が見つかりました。
Meta Discourse を検索
「customize about page profile field category:theme-component」で 4 件の結果が見つかりました。
さて、これを分解しましょう。スタッフリストのデフォルトの /about ページに、ユーザープロファイルから「自己紹介」コンテンツを追加したいのですね。
テーマコンポーネントのアプローチはアウトレットの使用を含みますが、/about ページのスタッフリスト内の特定の、きめ細かなアウトレットがないため、このデータを簡単に挿入できない可能性があるというのは、おっしゃる通りです。
検索結果と一般的なプラクティスに基づくと、アウトレットを使用しない場合、/about のような特定のコアテンプレートをカスタマイズする唯一の実行可能な方法は、テーマコンポーネント内で直接オーバーライドすることです。
テーマコンポーネントを使用した、おそらく最善のアプローチは次のとおりです。
- テーマコンポーネントを作成する: まだ作成していない場合は、新しいテーマコンポーネントを作成します。
- テンプレートをオーバーライドする:
about.hbsテンプレートをオーバーライドする必要があります。- テーマコンポーネントで、
common/templates/about.hbsというファイルを作成します。 - 元の
about.hbsファイルの内容を新しいファイルにコピーします。元のファイルはGitHubで見つけることができます。 - コピーした
about.hbsを編集します。model.adminsとmodel.moderatorsをループ処理するセクションを見つけます。ループ内（おそらく{{#each}}ブロック内）で、ユーザーオブジェクトにアクセスできます。「自己紹介」コンテンツは通常、user.profile.bio_rawまたは同様のプロパティにあります。各ユーザーに表示したい場所にこのプロパティをテンプレートに追加します。
- コンポーネントを有効にする: テーマコンポーネントをテーマに追加してアクティブ化します。
このアプローチを採用する理由:
- 直接制御:
/aboutページの HTML 構造を直接制御できます。 - 実行可能性: そのページ内のユーザーリストに専用のアウトレットがないため、その特定の場所にコンテンツをユーザーごとに挿入する最も簡単な方法です。
欠点（おっしゃる通り）:
- メンテナンス: Discourse が将来的にコア
about.hbsテンプレートを大幅に更新した場合、オーバーライドしたバージョンは自動的に更新されません。後で手動で変更を比較してマージする必要がある場合があります。これは、特定のアウトレットなしでコアテンプレートをカスタマイズする際のトレードオフです。
検索では /about ページに正確な例は見つかりませんでしたが、テンプレートを編集してプロファイル情報を追加することは、ユーザーカードやプロファイルのカスタマイズで見られる一般的なパターンです。
- Normalized Profile Links は、コンポーネントでのテンプレート編集を通じて、カスタムフィールドをユーザーカード/プロファイルに追加します。
- Quick Profile Links Menu は、ユーザープロファイルページに要素を追加します。
これらの例は、特定のアウトレットが利用できない場合、テーマコンポーネントはしばしばテンプレートのカスタマイズを伴うことを示しています。/about.hbs をオーバーライドすることは、この特定のユースケースにおけるこのパターンに従っています。
aas:
discourse/discourse リポジトリには about.hbs テンプレートがないようです。しかし、about.gjs テンプレートは app/assets/javascripts/discourse/app/templates/about.gjs にあるようです。
HelperBot:
おっしゃる通りです！ご指摘ありがとうございます。Discourse は、多くのコンポーネントで .gjs (GlimmerJS) テンプレートを使用するように移行しており、/about ページもその一つです。
古い .hbs 形式を参照してしまい、申し訳ありませんでした。
テンプレートの正しいパスは、確かにコアコードの app/assets/javascripts/discourse/app/templates/about.gjs です。
テーマコンポーネントを使用してこれをオーバーライドするプロセスは、概念的には同じですが、ファイルパスと構文が更新されます。
- テーマコンポーネントを作成/使用する: 前述の通りです。
- テンプレートをオーバーライドする:
- テーマコンポーネントで、対応するパスにファイルを作成します:
assets/javascripts/discourse/app/templates/about.gjs。 - 元の
about.gjsファイルの全内容を、テーマコンポーネントのabout.gjsファイルにコピーします (提供されたリンク)。 - コピーしたファイルを編集します。管理者とモデレーターをループ処理するセクションを探します。おそらく
{{#each this.admins as |admin|}}と{{#each this.moderators as |moderator|}}を使用しています。これらのループ内で、ユーザーオブジェクト（例:adminまたはmoderator）にアクセスできます。「自己紹介」フィールドを追加します。これはadmin.profile.bio_rawまたはmoderator.profile.bio_rawのようなプロパティを介してアクセスできるはずです。これを GlimmerJS テンプレート構造に統合する必要があります。たとえば、ユーザーの表示ブロック内に新しい<div>または<p>タグを追加する場合があります。
(注意: 自己紹介のレンダリングされた HTML バージョンが必要な場合は{{#each this.admins as |admin|}} <div class="user"> {{!-- 既存のユーザー情報（アバター、ユーザー名、名前など） --}} <UserAvatar @username={{admin.username}} @size="large" /> <div class="user-details"> <span class="username">{{admin.username}}</span> {{#if admin.name}}<span class="name">{{admin.name}}</span>{{/if}} {{#if admin.title}}<span class="title">{{admin.title}}</span>{{/if}} {{!-- 自己紹介セクションを追加 --}} {{#if admin.profile.bio_raw}} <div class="about-me"> {{{admin.profile.bio_cooked}}} {{!-- レンダリングされた HTML バージョンを使用する場合は bio_cooked を使用 --}} {{!-- 生のテキストが必要な場合は bio_raw を使用: <p>{{admin.profile.bio_raw}}</p> --}} </div> {{/if}} </div> </div> {{/each}} {{!-- モデレーターのループに対しても同様の変更を繰り返す --}}bio_cookedを使用し、プレーンテキストの場合はbio_rawを使用します。レイアウトに合わせて HTML 構造を調整してください。)
- テーマコンポーネントで、対応するパスにファイルを作成します:
- コンポーネントを有効にする: テーマコンポーネントがテーマに追加され、アクティブになっていることを確認します。
欠点は依然として同じです。このように /about.gjs のようなコアテンプレートをオーバーライドすると、Discourse の将来のアップデートで元の about.gjs ファイルが大幅に変更された場合、テーマコンポーネントのバージョンを手動で更新する必要がある可能性があります。しかし、より具体的なアウトレットがないことを考慮すると、これはこのレベルのカスタマイズを実現するための標準的な方法です。