ユーザープロフィールにカスタムアクティビティタブを作成する方法

SubStrider · 2025 年 4 月 9 日午前 10:29

プラグイン開発を試していましたが、プラグインの設定を管理者の設定ページに表示させることはできましたが、DiscourseのUIにUI要素を表示させる方法がよくわかりません。

関連するドキュメントや、参考として既存のプラグインのどのファイルを見ればよいか教えていただけると大変助かります。

追伸：
全体的にこれらのセクションを修正しようとしています。

投稿内のユーザー名の下にある（トピックメタデータ）ユーザービットエリアにカスタム文字列を追加する。
フォームを開くためのボタンを投稿コントロールエリアに追加する。
ユーザープロフィールのアクティビティページにカスタムタブを追加する。
ユーザーカードとユーザーサマリー統計にカスタムサマリー情報の一部を追加する。

Arkshine · 2025 年 4 月 9 日午前 11:36

Introducing Discourse developer toolbar を使用することをお勧めします。

次に、コンポーネントを挿入できるプラグインアウトレットを探します。

すると、例えば次のようなものが見えます。

これについてのガイドはこちらです。

SubStrider · 2025 年 4 月 9 日午後 6:13

プラグインのアウトレットをリクエストすることは可能ですか？

ユーザーの評判評価をユーザー名の下に挿入したいと考えています。または、経験に基づいて、どこに挿入するのが良いでしょうか。topic-map-expanded-after？

Arkshine · 2025 年 4 月 9 日午後 6:30

はい、可能です！Dev トピックを作成してください。

何らかの理由で表示されませんが、投稿名の周りにはアウトレットがあります:

古い回答

discourse/app/assets/javascripts/discourse/app/components/post/meta-data/poster-name.gjs at main · discourse/discourse · GitHub

これには、glimmer post stream モードを有効にする必要があります。

その後、表示されます。

NateDhaliwal · 2025 年 4 月 9 日午後 10:56

このアウトレットは post-metadata__after になりますか、それとも renderAfterWrapperOutlet("post-metadata") を使用しますか？

Arkshine · 2025 年 4 月 9 日午後 11:10

それは試すのに良い選択肢になるでしょう。

david · 2025 年 4 月 10 日午前 11:06

これを試しても問題ありませんが、設定の説明にある免責事項を必ずお読みください。このモードはまだ本番環境での使用には適していません。Metaでも使用していません。

現在の投稿ストリーム実装では、古い decorateWidget API または addPosterIcon API を使用する必要があります。

github.com/discourse/discourse

app/assets/javascripts/discourse/app/lib/plugin-api.gjs

80e6d3d8c


      
          /**
           * addPosterIcons(callback)
           *
           * This function can be used to add one, or multiple icons, with a link that will
           * be displayed beside a poster's name. The `callback` is called with the post's
           * user custom fields and post attributes. One or multiple icons may be rendered
           * when the callback returns an array of objects with the appropriate attributes.
           *
           * The returned object(s) each can have the following attributes:
           *
           *   icon        the font awesome icon to render
           *   emoji       an emoji icon to render
           *   className   (optional) a css class to apply to the icon
           *   url         (optional) where to link the icon
           *   title       (optional) the tooltip title for the icon on hover
           *   text        (optional) text to display alongside the emoji or icon
           *
           * ```
           * api.addPosterIcons((cfs, attrs) => {
           *   if (cfs.customer) {

This file has been truncated. show original

Arkshine · 2025 年 4 月 10 日午前 11:22

すみません、デイビッド、新機能に興奮しすぎて、まだ開発中であるという警告を完全に無視してしまいました。次からは気をつけます。

SubStrider · 2025 年 4 月 17 日午前 7:33

このために、ボタンをレンダリングするために以下を使用しました。

api.registerValueTransformer("post-menu-buttons", ({ value: dag, context })

現在、他のコンポーネントを使用してモーダルをエラーなしで開くことができず、行き詰まっています。

system · 2025 年 5 月 17 日午前 7:33

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.

トピック		返信	表示
How to Integrate a Custom Plugin in discourse UI Dev	7	167	2025 年 2 月 15 日
Developing Discourse Plugins - Part 2 - Connect to a plugin outlet Developer Guides plugin-guides , tutorial	38	29464	2025 年 11 月 23 日
How to add a custom button in user profile card? Dev	5	599	2024 年 4 月 24 日
Using template hbs to add HTML content to a plugin outlet Dev	2	90	2025 年 6 月 23 日
Missing PluginOutlet for second-factor.gjs component and for second-factor-add-totp.gjs Dev development	12	139	2025 年 10 月 24 日

ユーザープロフィールにカスタムアクティビティタブを作成する方法

関連トピック