manuel
2026 年 4 月 7 日午前 9:44
1
テーマの再構築に関する2回目のアップデートを刚刚リリースしました。最初のアップデートは、以前の Meta Branded テーマを基にしたビジュアルのリフレッシュでしたが、今回のバージョンは実質的にゼロから再構築された新しいテーマです。新しいブランド言語は以前のリリースで既に導入されているため、その方面での目に見える変化はあまりありません。今回のアップデートで大きく変わったのは、テーマの実装そのものであり、Discourseのカスタマイズがより広範にどのように進んでいくかを示すものです。
いくつかの実装詳細を、小さな項目から順にご紹介します。
Lucide はモダンなストロークアイコンのオープンソースセットであり、私たちは複数のカスタマイズプロジェクトでこれを採用しています。今回のイテレーションでは、Meta Branded テーマにも含めました。Discourse コア内の Font Awesome を置き換える計画はありませんが、Font Awesome の無料版ではストロークスタイルのアイコンの選択肢が限られており、一貫したストロークアイコンシステムを形成するには不十分です。テーマコンポーネントは Discourse Lucide Icons で利用可能です。
管理者およびユーザーのインターフェース設定において、特定のテーマで利用可能な色パレットを制限する新しい only_theme_color_schemes テーマ修飾子を追加しました。Meta には複数のユーザー選択可能なパレットがあり、これらは Meta Branded テーマのビジュアルアイデンティティと衝突する可能性があります。この修飾子により、テーマにバンドルされたパレットのみがオプションとして提供されます。FEATURE: add modifier to restrict theme color schemes
メインコンテンツをページ上でより適切に中央揃えにするため、Discourse Full-width コンポーネント の調整も試みています。ヘッダーには多くの動的要素があり、設定が複雑化しているため、現時点では実験的であり、コンポーネントのブランチでのみ利用可能です。
新しい welcome-banner-display-for-route 値変換子を使用して、コアのウェルカムバナーがどのルートで表示されるかをプログラム的に制御しています。これにより、バナーがデフォルトのカスタムホームページでのみ表示され、ユーザーが個人のランディングページとして設定したページでは表示されないようにしています。DEV: Add welcome-banner-display-for-route value transformer
これで、2 つの大きな変更について説明します。
custom_homepage テーマ修飾子はほぼ 2 年間利用可能でしたが、Meta 自体のホームページ体験を形作るために使用するのは今回が初めてです。注目のコンポーネントで構成されたカスタムランディングページを導入します。最初のリリースでは、注目のカテゴリのハイライトと最新のトピックのプレビューが含まれます。
これらの注目コンポーネントは、新しい実験的な Blocks API を使用して構築しました。これが最大の变化につながります。
Blocks API は、Discourse でモジュール化され、組み合わせ可能なレイアウトを構築するための新しいフレームワークです。テーマ開発者は、定義されたレイアウト領域に配置できる自己完結型で再利用可能なコンポーネントからページを組み立てることができます。Meta テーマは、この API の初の本番環境でのデプロイです。
このフレームワークには豊富な開発者ツールが備わっています。開発者ツールを有効にすると、すべてのアクティブなレイアウト領域とそのコンポーネントを可視化するビルトインのオーバーレイを使用して、任意のページのブロック構造を検査できます。
ホームページ以外にも、各カテゴリのサブカテゴリを表示するカスタムカテゴリバナーのレンダリングにもブロックを使用しています。
これは本番環境でのシステムの実装に関する初期プレビューです。近日中にドキュメントとさらに多くの例を公開する予定です。DEV: Add Block API for declarative, validated UI extension points
「いいね！」 19
Canapin
2026 年 4 月 7 日午前 10:18
5
これは良い選択ですね。Discourse で利用可能なアイコンセットを検討していた際に、このセットに目が留まりました。洗練されており、エレガントです。
塗りつぶされたアイコンが完全に存在しないことがいくつかの問題を引き起こしていました。例えば、未読インジケーターが色付きの円としてほとんど見えないことや、ダーク/ライトの切り替えボタンが塗りつぶされた部分なしでは適切に描画しにくいことなどです。
メタブランデッドテーマではこれらの問題を解決されているのにお気づきでしょうか？これのためにカスタムアイコンを追加されたのでしょうか？
余談ですが、メタブランデッドテーマの左上にある Discourse ロゴはクリックできません（数ヶ月前からそうなっていると思います）：grimacing
「いいね！」 1
manuel
2026 年 4 月 7 日午前 10:26
6
いいえ、circle や square などのいくつかのアイコンを Lucide 版にマッピングしなかっただけです。正確には、これらのアイコンについては Fontawesome のストローク版（far-circle など）のみをマッピングしました。マッピングの改善が必要となる他の事例もあるかもしれません。
例えば、ハートアイコンは少し厄介です。いいねされた際には塗りつぶし版の方が良いと思うのですが、現時点ではそれをどう実装するのが最適か確信が持てません。
再現できませんが、もっと詳しい情報はありますか？
「いいね！」 3
Blocks が Plugin Outlets にはないどのような違いをもたらすのか、気になります。
「いいね！」 2
Canapin
2026 年 4 月 7 日午後 12:25
8
Chrome と Edge のみでテスト済みで、かつデスクトップ環境でのみ発生します：
サイドバーのトグル div がロゴを覆い、クリック不可能になっています。
（それに、アウトライン付きの「いいね」ハートは見た目が悪いですね
「いいね！」 1
Canapin
2026 年 4 月 7 日午後 12:45
9
「返信した」の現在のアイコンが全く気に入らないです：
Lucide に適切な FA の同等アイコンがないため、一時的なものだと推測しますか？
トピック一覧のアイコンは非常に、非常に小さすぎます：
編集：他のテーマでも同じです。
カテゴリアイコンはタグアイコンよりも小さく見え、不自然です。選択されたカテゴリアイコンのサイズ全体が、ボックス型のカテゴリスタイルによって制約され、スペースが不足しているように感じます…
「いいね！」 3
公式テーマにLucideが追加されるとは思いもしませんでした。とても素敵ですね！ただ、ハートが塗りつぶされていると良かったのにと思います。その小さな不満を除けば、このテーマはモバイルでも私には最高に見えます。
PMの本文にパディングがないようです：
「いいね！」 2
Ed_S
2026 年 4 月 7 日午後 1:39
11
同意します！
上記にも同意ですが、空心のハートは良くありません。
「いいね！」 2
ふむ…一つ変更できるとすれば、チャットアイコンを message-square-text から message-square にするのはどうでしょうか？線が少し気になります。
「いいね！」 1
manuel
2026 年 4 月 7 日午後 4:20
13
アイコンに関するフィードバックをありがとうございます！セット専用のトピックを新たに作成しました：Discourse Lucide Icons 。
できれば、そこでさらにフィードバックを集めながら、セットを続けて磨いていければと考えています。
ToddZ
2026 年 4 月 8 日午前 9:20
14
現在の .74em ではアイコンがほとんど判読できないことに同意します。約 1em が必要です。
「いいね！」 1
ToddZ
2026 年 4 月 9 日午後 1:19
15
気のせいでしょうか、それとも今日のトピックリスト内の縦方向のパディングが増えたのでしょうか？レイアウトが以前より緩やかになったのか、それとも私が以前より鈍感になったのか。
「いいね！」 1
それ、私も気づきました。手動で元に戻そうとしましたが（見た目の美しさより情報の密度を優先するので）、うまくいきませんでした
manuel
2026 年 4 月 9 日午後 4:55
17
デザイン観点からの主な違いは、PluginOutlet が挿入ポイントである点です。コアテンプレートに直接コンポーネントを注入します。つまり、すべてのカスタマイズが実際にはアプリの構造を変更します。
一方、BlockOutlet はレイアウトフレームです。フレームに1つ以上のコンポーネントを登録します。その後、カスタマイズはアプリテンプレート内ではなく、そのフレーム内で実行されます。これにより、より予測可能で安定したレイアウトを実現できます。
もう一つの大きな違いは、Blocks API が条件付きレンダリングロジックの全範囲を処理できる点です。コンポーネントにそのロジックを追加する必要はありません。ブロックコンポーネントはコンテンツとテンプレートに専念でき、重複するロジックが大幅に削減されます。
「いいね！」 1
darkpixlz:
でもうまくいきませんでした
もし誰かがよりコンパクトなトピック一覧を希望されるなら、私にはこれが機能しました：
.topic-list .topic-list-data {
padding: 8px 0px;
line-height: 0px;
}
Canapin
2026 年 4 月 10 日午前 11:50
19
新しいメタブランドテーマは、モバイルでの余白が多すぎるように感じます。
画面の端とコンテンツコンテナの間に1段の余白
ページコンテナと実際のコンテンツの間に2段の余白
他のテーマには、画面の端とコンテンツコンテナの間のこの最初の隙間はありません。
そのせいで、コンテンツが横方向に少し「押しつぶされた」ように見え、スペースが非常に狭くなっています。特に「マイ投稿」ページでは、Horizon と比較して明確にわかります。
Horizon は可読性を損なわずに、はるかに多くのコンテンツを表示できます。
フルコンテンツページでテーマのブランド性を際立たせるため、紫色の「アウトライン」背景を採用する意図は理解できますが、そのような狭い画面ではスペースのロスが大きすぎると思います。
他にも小さな批判点があります。
左上のアイコンが完全な円形ではなく、わずかに扁平になっています。
カテゴリ/タグのポップアップで、テキストエリアがわずかにはみ出しています（これがこのテーマに関連するものかどうかはわかりません）：
。これを覆うようにするのが良いと思います。
「いいね！」 1
PR: FEATURE: add modifier to restrict theme color schemes
）
