編集に適したテンプレートを見つけるための最良の戦略は？

開発
1

Discourse はまだ初心者ですが、それをカスタマイズするためにコードを記述する方法について学んでいます。特定の場所（一般的な出力エリアよりもターゲットを絞った場所）にコードを挿入する最良の方法を学ぼうとしています。その場所を制御するテンプレートをオーバーライドする必要があるようです。

つまり、カスタマイズダッシュボードの 領域で行うか、テーマとして使用する別の GitHub リポジトリで行うかにかかわらず、以下の手順を踏む必要があります。

  1. 編集する正しいテンプレートを見つける
  2. コーディングを行っている場所（ダッシュボード、リポジトリなど）でテンプレート全体を再出力する
  3. テンプレートに変更を加える

ステップ 1 が障害となっています。編集する正しいテンプレートをどのように見つけられますか？

私が把握しているのは以下の通りです。Discourse のテンプレートはこちらにあり、「実際の」編集対象となるテンプレートは一般的にコンポーネントファイルこちらにあります。

例として、グループインデックスページ（このページに相当）の各グループリストに1行を追加したいとします。そのテンプレートはどこにあるでしょうか？私の最善の推測では、グループカードテンプレートですが、Ember にまだ慣れていないため確信が持てません。

正しいテンプレートを特定するためのより確実な方法はありませんか？

2

Ember ブラウザ拡張機能を試しましたか？

テンプレートとコンポーネントを表示します：

image
image494×456 25.2 KB

「いいね！」 4
3

それは素晴らしいですね。Ember Inspectorのことをおっしゃっているのでしょうか？

「いいね！」 1
4

わかりました。それを使ってみて、一つわからない点があります（おそらく私が Ember に慣れていないことが原因だとは思いますが）：

Discourse の グループページ を見てみると、各グループエントリには名前とユーザー数が表示されています。

Ember インスペクタで確認すると、名前は groups-info テンプレートから来ていることがわかりますが、group-user-count はどこから来ているのでしょうか？（Ember インスペクタにはそのエントリは表示されていないようです）

5
6

ありがとうございます。group-user-count が 55 行目に表示されているのを見つけました。

これは、例えば group-user-count の行の直前に新しい行を追加したい場合、その index.hbs ファイルの全 100 行をコードにコピーして、以下のように挿入する必要があるということでしょうか？
<script type="text/x-handlebars" data-template-name="groups/index">
[100 行]
</script>

7
  • 通常は、適切なプラグインアウトレットがあるか確認し、それを使用します。
  • jQuery を使って要素をターゲットにすることもできますが、反復的な要素を変更しようとする場合は機能しません。

上記のいずれの方法も取れない場合:

  • 正当な理由を添えて、Discourse チームにプラグインアウトレットの追加を依頼する
  • ご提案の通り、テンプレート全体を独自のものに置き換える
「いいね！」 2
8

それは、周囲のアウトレット（components/group-info など）のコードを変更することを意味しますか？

編集：すみません、テンプレートとプラグインアウトレットを混同していました。プラグインアウトレットとは、Discourse チームがコード内に配置した（例：{{plugin-outlet name="topic-above-post-stream" args=(hash model=model)} のような）行であり、コードを変更するためのアンカーとして使用できるものであることを理解しました。

9

編集: このフォローアップをこちらに移動しました。少し異なる問題に関するものであるためです。